New Media Technology multi-media manual Synchronizing Your Tutorial with Smil, Tutorial.smil

Models: multi-media

1 15
Download 15 pages 49.47 Kb
Page 10
Image 10

Synchronizing Your Tutorial with SMIL

SMIL, the synchronized multimedia integration language, is an XML-based mark-up language. If you’ve ever used HTML to create a Web page, SMIL will look somewhat familiar.

A very simple SMIL file and an included RealPix file appear on the right.

Notice that in SMIL, as in XML, every tag is closed using the ‘/’ character. If the tag does not contain other tags, the ‘/’ character simply ap- pears adjacent to the closing ’>’.

The two most important sections of the docu- ment appear in red and blue. The red section simply describes the layout of the presentation. The root-layout appears in every SMIL file; it defines the dimensions of the entire SMIL pre- sentation. Once the root layout has been estab- lished, individual regions are defined within the root area in which the visual media may appear. In this file, only one region has been defined. It begins 0 pixels from the top of the presentation and 0 pixels from the left and occupies the entire presentation area.

In the blue section, the individual pieces of me- dia are synchronized. The audio and the first image begin simultaneously (as indicated by the <par> tags), but the first image disappears after 6 seconds. Note that the audio file is referenced with the full URL using the protocol “rtsp” instead of “http”; this is because the audio file is hosted on a machine running Real Server. The second image appears 6 seconds into the audio piece and disappears at 12 seconds. The third image

tutorial.smil

<smil>

<head>

 

 

<meta name=”title” content=”Engineering Communications Tutorial”/>

<meta name=”author” content=”Tutorial Team”/>

<meta name=”copyright” content=”(c)2002 McKinney Engineering Library”/>

<layout>

 

<root-layout background-color=”white” width=”500” height=”330”/>

 

<region id=”graphics” top=”0” left=”0” width=”500” height=”330”/>

</layout>

</head>

 

 

<body><par>

<audio src=”rtsp://real.myserver.edu/tutorials/audio.rm”/>

 

<img src=”intro.gif” region=”graphics” begin=”0s” end=”06s”/>

 

<img src=”picture1.gif” region=”graphics” begin=”06s” end=”12s”/>

 

<img src=”slides.rp” region=”graphics” begin=”12s” end=”25s”/>

</par> <img src=”conclude.swf” region=”graphics” begin=”25s” end=”35s”/>

</body>

<imfl>

 

</smil>

 

<head width=”500” height=”330”

 

 

title=”Indexes”

 

 

author=”Engineering Communications Tutorial Team”

 

 

copyright=”(c) 2002 McKinney Engineering Library”

 

 

timeformat=”dd:hh:mm:ss.xyz”

 

 

duration=”0:13.0”

 

 

bitrate=”100000”

 

 

aspect=”true”/

 

 

background-color=”#ffffff”/>

 

 

<image handle=”1” name=”images/slide1.gif”/>

 

 

<image handle=”2” name=”images/slide2.gif”/>

 

 

<image handle=”3” name=”images/slide3.gif”/>

 

 

<fill start=”0” color=”white”/>

 

 

<fadein start=”0” duration=”1” target=”1”/>

 

slides.rp

<crossfade start=”3” duration=”1” target=”2”/>

 

<wipe direction=”up” start=”6” duration=”2” target=”3”/>

 

 

 

 

<fadeout start=”12” duration=”1” color=”white”/>

 

 

</imfl>

 

 

 

 

p. 10

Page 10
Image 10
New Media Technology multi-media manual Synchronizing Your Tutorial with Smil, Tutorial.smil