Student Pages anni/roster.html.

Student Pageshttp://www.clsp.jhu.edu/~anni/roster.html

http://www.clsp.jhu.edu/~anni/roster.html

Last Time: HTML Forms and Javascript

If you haven’t finished the survey assignment, email us or come to office hours

2/14: Programming Phones

This script says “hello world”<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <block> Hello World! <exit/> </block> </form></vxml>


Call 877-500-VXML and use my developer ID

(540460366) and pin (0123) to preview it

When you’re done, put this text into your Scratchpad and call

VXML again and use your developer ID and pin to preview

your own code

Prerequisite: XML

XML

Disclaimer: This is an introduction to how an XML format works in general, this is not the particular syntax of a VoiceXML program or any other specific XML format

XMLOpening and closing tags

<myTellmeProgram> </myTellmeProgram>

XMLNested hierarchy of tags

<myTellmeProgram> <introduction> <welcome>Hello World</welcome> <welcome>Hi, What’s up?</welcome> </introduction> <mainSection> … </mainSection></myTellmeProgram>



Level 1 (Document Root)




Level 2




Level 2

Level 3

XMLTag Attributes

<myTellmeProgram> <introduction> <welcome type=“veryFirst”>Hello World</welcome> <welcome type=“casual”>Hi, What’s up?</welcome> </introduction> <mainSection> … </mainSection></myTellmeProgram>

Attribute Value

XMLComments

<myTellmeProgram>  <introduction> <welcome type=“veryFirst”>Hello World</welcome> <welcome type=“casual”>Hi, What’s up?</welcome> </introduction> <mainSection> … </mainSection></myTellmeProgram>

VoiceXML (Programming Phones)

VoiceXML: Form Blocks

<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <block> Hello World! <exit/> </block> </form></vxml>

Audio (“Text to Speech”)

Exit the application



Note beginning and end tags



This should be what’s in your Scratchpad now

Back to Javascript

Just like you can embed Javascript into HTML, you can embed Javascript into VoiceXML

https://studio.tellme.com/vxml2/ovw/javascript.html


Back to Javascript

Just like you can embed Javascript into HTML, you can embed Javascript into VoiceXML


But we won’t do that in this class…


VoiceXML: <goto> tag<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <block> Hello World! <goto next=“#secondGreeting”/> </block> </form> </vxml>


Tag


Tag

Attribute


Tag

Attribute Value: Name of another form

VoiceXML: <goto> tag<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <block> Hello World! <goto next=“#secondGreeting”/> </block> </form> <form id=“secondGreeting”> <block> I found my second form. <exit/> </block> </form></vxml>


Attribute


Attribute

Value


Sounds like…:“Hello WorldI found my second form.”

Try this in your Scratchpad<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <block> Hello World! This dialogue goes on <goto next=“#secondGreeting”/> </block> </form> <form id=“secondGreeting”> <block> and on <goto next=“#secondGreeting”/> </block> </form></vxml>

1. Guess what this script will do.2. Edit Scratchpad3. Call 1-877-500-8965



Attribute



AttributeValue


<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers” type=“boolean”> </field> </form></vxml>

Attribute Value

VoiceXML: Form Blocks<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers” type=“boolean”> <prompt> Do you like computers? </prompt> </field> </form></vxml>

New “prompt” tag: child of “field”

VoiceXML: Form Blocks<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers” type=“boolean”> <prompt> Do you like computers? </prompt> </field> </form></vxml>

Text to Speech:“Do you like computers?”

VoiceXML: Form Blocks<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers” type=“boolean”> <prompt> Do you like computers? </prompt> <filled> </filled> </field> </form></vxml>

New “filled” tag: child of “field”

VoiceXML: Form Blocks<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers” type=“boolean”> <prompt> Do you like computers? </prompt> <filled> Great, I got your answer.

</filled> </field> </form></vxml>

Text to Speech:“Great, I got

your answer”



Broken!

VoiceXML: Form Blocks<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers” type=“boolean”> <prompt> Do you like computers? </prompt> <filled> Great, I heard your answer.


Broken!



Broken!

VoiceXML: Form Blocks<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers”> <prompt> Do you like computers? </prompt>

<filled> Great, I got your answer. </filled> </field> </form></vxml>

Since the predefined boolean grammar isn’t working, we’ll add one ourselves

VoiceXML: Form Blocks<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers”> <prompt> Do you like computers? </prompt> <grammar mode="dtmf" root="top” version="1.0" tag-format="semantics/1.0" type="application/srgs+xml">

<rule id="top"> <one-of> <item>1</item> <item>2</item> </one-of> </rule> </grammar> <filled> Great, I got your answer. </filled> </field> </form></vxml>

Press 1 or 2, record the

answer

Copy and paste this to receive any “1 or

2” input

VoiceXML: Form Blocks<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers”> <prompt> Do you like computers? </prompt> <grammar mode="dtmf" root="top” version="1.0" tag-format="semantics/1.0" type="application/srgs+xml">


<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers”> <prompt> Do you like computers? </prompt> <grammar mode="dtmf" root="top” version="1.0" tag-format="semantics/1.0" type="application/srgs+xml">



Input type will be a touch tone keyboard




Reference some touch tone input gathering code




A grammar can have many rulesIn this example, when this

grammar is used, it should start with the rule named “top”




“one-of” tag: user specifies one of the

following items




The allowable items are “1” and “2”




Text to Speech:“Great, I got

your answer”




Try this!




Now let’s do something with the input after it’s identified

<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers”> <prompt> Do you like computers? </prompt> <grammar mode="dtmf" root="top” version="1.0" tag-format="semantics/1.0" type="application/srgs+xml"> <rule id="top"> <one-of> <item>1</item> <item>2</item> </one-of> </rule> </grammar> <filled> Great, I got your answer. </filled> </field> </form></vxml>


<vxml version="2.1” xmlns="http://www.w3.org/2001/vxml"> <form> <field name=“likeComputers”> <prompt> Do you like computers? </prompt> <grammar mode="dtmf" root="top” version="1.0" tag-format="semantics/1.0" type="application/srgs+xml"> <rule id="top"> <one-of> <item>1</item> <item>2</item> </one-of> </rule> </grammar> <filled> Great, I got your answer. <if cond="likeComputers==1"> I'm glad you like computers. <else /> Too bad that you don't like computers. </if> <exit/> </filled> </field> </form></vxml>




“if-else” tag:Special two-part tag:

1. The if part2. The else part



If some condition is met, do what follows here

Otherwise, do what follows here



The “if” tag has a “cond” condition

attribute

The condition here is that the “likeComputers” field is filled with the value “1”



Notice the double “==“



If the condition is true, say this.



If the condition is not true, say this



[If time in class]: Try it! (might want to download the

slides and copy and paste from them, but you’ll have to fix up the quotes)

VoiceXML HomeworkIn this homework you have two options (extra credit: do both!):1. Use the prompt/grammar/filled children of the field tag to ask a question.

Modify what we’ve done to accept more than “1” and “2” as input, and have the computer say something different in response to each one

2. Use the prompt/grammar/filled children of the field tag to ask a question. Then, if the user inputs a “1”, have the computer repeat a phrase forever. If the user inputs a “2”, just have the computer say one thing.

Add a tiny bit of text to your webpage with your Developer ID & pin so that we can listen. Also send Ken ([email protected]) and me ([email protected]) an email with the contents of your Scratchpad.

Due Tuesday, February 22nd before sunrise.

Hint for Option #11. Use the prompt/grammar/filled children of the field tag to ask a question.

Modify what we’ve done to accept more than “1” and “2” as input, and have the computer say something different in response to each one

<if cond="likeComputers==1"> I'm glad you like computers. <else /> Too bad that you don't like computers. </if>

<if cond="likeComputers==1"> I'm glad you like computers.</if><if cond="likeComputers==2"> Too bad that you don't like computers.</if>

=

Hint for Option #22. Use the prompt/grammar/filled children of the field tag to ask a question.

Then, if the user inputs a “1”, have the computer repeat a phrase forever. If the user inputs a “2”, just have the computer say one thing.

<if cond="likeComputers==1"> I hope you’ll like computers forever <else /> Too bad that you don't like computers. </if>

<form id=“secondGreeting”> <block> and ever <goto next=“#secondGreeting”/> </block> </form>

+<goto next=“#secondGreeting”/>

+

Another Hint for Option #22. Use the prompt/grammar/filled children of the field tag to ask a question.

Then, if the user inputs a “1”, have the computer repeat a phrase forever. If the user inputs a “2”, just have the computer say one thing.

<vxml version="2.1" xmlns="http://www.w3.org/2001/vxml"> <form>…</form>

<form id=“second”>…</form></vxml>

Note that your single <vxml> code can

include multiple forms

More Advanced Phone Programming

<?xml version="1.0"?><vxml version="2.1" xmlns="http://www.w3.org/2001/vxml"><form id="pick_fruit"> <block> Welcome to the fruit picker. </block><field name="fruit"> <grammar mode="voice" root="root_rule" tag-format="semantics/1.0" type="application/srgs+xml" version="1.0" xml:lang="en-US"> <rule id="root_rule" scope="public"> <one-of> <item><one-of> <item>apple</item> </one-of><tag>out.fruit = "apple";</tag> </item> <item><one-of> <item>orange</item> </one-of><tag>out.fruit = "orange";</tag> </item> <item><one-of> <item>pear</item> </one-of><tag>out.fruit = "pear";</tag> </item> </one-of> </rule> </grammar> <prompt>Pick a fruit.<break size="medium"/></prompt> <catch event="noinput nomatch"> Please pick a fruit. </catch> <filled> You picked <value expr="fruit"/>  <clear namelist="fruit"/> </filled></field></form></vxml>


Major Components:1. Block introduction2. Field for user input3. Grammar4. Prompt5. Filled(6. catch)


Grammar:Speech Recognition, not Touch Tone like before


Grammar:Three possible answers:

Apple, Orange, Pear

<?xml version="1.0"?><vxml version="2.1" xmlns="http://www.w3.org/2001/vxml"><form id="pick_fruit"> <block> Welcome to the fruit picker. </block><field name="fruit"> <grammar mode="voice" root="root_rule" tag-format="semantics/1.0" type="application/srgs+xml" version="1.0" xml:lang="en-US"> <rule id="root_rule" scope="public"> <one-of> <item><one-of> <item>apple</item> <item>red</item> </one-of><tag>out.fruit = "apple";</tag> </item> <item><one-of> <item>orange</item> </one-of><tag>out.fruit = "orange";</tag> </item> <item><one-of> <item>pear</item> </one-of><tag>out.fruit = "pear";</tag> </item> </one-of> </rule> </grammar> <prompt>Pick a fruit.<break size="medium"/></prompt> <catch event="noinput nomatch"> Please pick a fruit. </catch> <filled> You picked <value expr="fruit"/>  <clear namelist="fruit"/> </filled></field></form></vxml>

Grammar:For Apple can say “apple” or “red”


Filled:Repeats the input that is heard


No match with Grammar or No input at all:“Please pick a fruit”

More Advanced Phone Programming:

Full example with even more bells and whistles here:

https://studio.tellme.com/vxml2/ref/elements/prompt.html

https://studio.tellme.com/vxml2/ref/elements/prompt.html

Student Pages anni/roster.html.

Documents

Transcript of Student Pages anni/roster.html.