3. A First Web Page
3.1 A SALT version of the "Hello World!" program
A tradition in computer programming is to introduce a new programming language
by describing a program that does nothing but say 'Hello'. In that tradition you will see a SALT program below that when run within Internet Explorer with the Speech Add-in installed will speak "Hello World"!
| 1 |
<html xmlns:salt="http://www.saltforum.org/2002/SALT"> |
| 2 |
<object id="speech-add-in" CLASSID="clsid:33cbfc53-a7de-491a-90f3-0e782a7e347a"> |
| 3 |
</object> |
| 4 |
<?import namespace="salt" implementation="#speech-add-in" /> |
| 5 |
<body onload="hello.Start()"> |
| 6 |
<salt:prompt id="hello"> |
| 7 |
Hello world! |
| 8 |
</salt:prompt> |
| 9 |
</body> |
| 10 |
</html> |
If you have the Speech add-in installed, you can try this out on your computer: Normal version, Debug version.
Let's look at this, line by line.
- Line 1
- A SALT program is just an HTML coded web page in which special mark-up tags are
embedded. This line opens the HTML mark-up and provides a reference to a URL which
defines the SALT namespace - this defines the names of the additional tags
that are going to be used.
- Lines 2 & 3
- While line 1 defines the names of the tags, these lines define the implementation
of the tags. Here the implementation is being performed by the Speech Add-in which
is an Active-X object. This HTML <object> tag loads the speech add-in by using
its CLASSID identifier which uniquely specifies it. Here we also give the object the
name "speech-add-in" so we can refer to it later. Note that there are actually two
Speech Add-ins for Internet Explorer and they have different CLASSIDs. The one used here
is the normal end-user version that is part of the Speech add-in redistributable files.
The other one comes with the full SASDK and links in with the Visual Studio .NET debugger. If you
want (or need) to use that object, its
CLASSID="clsid:DCF68E5B-84A1-4047-98A4-0A72276D19CC".
- Line 4
- This line links the name space to the implementation. It is an XML process instruction
to Internet Explorer which links the SALT namespace to the Speech add-in object.
- Line 5
- This line starts the body of the HTML document. Note that the "onLoad" attribute of
the body element is used to fire a scripted event when the page is loaded. In this case we ask that the 'Start()' method of the 'hello' object should be run.
- Line 6
- This line opens a SALT-specific tag type: a 'Prompt' element. Prompt elements are used to
identify text or audio files used to communicate with the user. The usage 'salt:prompt' tells
IE to use the 'prompt' tag in the 'salt' namespace.
- Line 7
- This line is the content of the 'prompt' element - here it is just the text we want the
system to read.
- Line 8
- Closes the SALT prompt element.
- Line 9
- Closes the HTML body element.
- Line 10
- Close the HTML html element.
3.2 Internet Explorer security
If you open this file in Internet Explorer and get the warning message below, this is because
security settings do not automatically allow the use of Active-X controls on web pages.
You can either click on the yellow 'Information Bar' and choose 'Allow Blocked Content', or you can
change the default security settings to allow all active objects loaded from pages on your
computer to run without the warning. To do this choose Tools/Internet Options, then
select the Advanced tab and scroll down to the Security section. Then check the
option "Allow active content to run in files on my computer":
This lets the speech add-in to run without the warning provided that it is properly installed on your computer.
3.3 Simple variation
A simple variation on the 'Hello World' program allows us to speak text entered by
the user into an input field. In the page below, we connect a button to a Javascript
function which retrieves the contents of an input text field
and passes it to the Start() method of a SALT prompt object.
Try this out on your computer: Normal version, Debug version.
<html xmlns:salt="http://www.saltforum.org/2002/SALT">
<object id="speech-add-in" CLASSID="clsid:33cbfc53-a7de-491a-90f3-0e782a7e347a">
</object>
<?import namespace="salt" implementation="#speech-add-in"/>
<salt:prompt id="prompter"></salt:prompt>
<body>
<h2>SALT: Speak Field Contents</h2>
<input type="text" id="iptext" name="iptext" value="Type some text here" size="40">
<input type="button" name="speak" value="Speak" onClick="dospeak()">
</body>
<script>
function dospeak()
{
var pfield=document.getElementById("iptext");
var pprompt=document.getElementById("prompter");
pprompt.Start(pfield.value);
}
</script>
</html>
The changes we have made are:
- Move the prompt text out of the "prompter" object.
- Create an input text field "iptext", and a Speak button. Connect the button
to a Javascript function "dospeak()".
- In the dospeak() function, get object references for both the iptext field and the prompter object. Then pass the value of the iptext object (i.e. its content) into the Start() method of the prompt object.
This is what it should look like. Type in some text and click on Speak to hear the computer say it.
Next: speech recognition.