1 / 23

Lecture16

Lecture16. Synchronized Multimedia Integration Language (SMIL) - I. Emergence of XML. HTML has grown into a large language incorporating lot of tags. It has a very forgiving syntax thus making browser software large.

laurel-salas
Download Presentation

Lecture16

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Lecture16 Synchronized Multimedia Integration Language (SMIL) - I

  2. Emergence of XML • HTML has grown into a large language incorporating lot of tags. • It has a very forgiving syntax thus making browser software large. • Some applications may benefit with more new tags while some may benefit with lesser tags thus making small size browser software possible. • XML was originally developed to address the short comings of HTML.

  3. XML is stricter • In HTML, in certain cases you may omit ending tags but this is not possible with XML. • The reason is to make the browser software simple and smaller making applications such as handheld devices possible.

  4. XML enforces structure • HTML has a mixture of tags to represent the structure as well as rendering of the information in documents. • This leads to difficulties in maintenance as well as using such information in different applications or platforms. • XML involves a set of standards to exchange and publish information in a structured manner. • Thus XML is language used to describe and manipulate structured documents. • Manipulating documents is done through the structure and hence structure is the key.

  5. XML Applications • Synchronized Multimedia Integration Language (SMIL) • X3D – A new VRML standard.

  6. SMIL • Synchronized Multimedia Integration Language (SMIL) is to synchronized multimedia what HTML is to hyperlinked text. • It is a simple vendor-neutral markup language. • Whilst the SMIL language is a powerful tool for creating synchronized multimedia presentations on the web over low bandwidth connections. It is mainly meant to work with linear presentations where several types of media can be synchronized to one timeline. • SMIL documents are actually XML documents which conform to the SMIL XML DTD (XML stands for eXtensible Markup Language and DTD stands for Document Type Definition).

  7. Creating a SMIL Document Every SMIL file should start with a line identifying it as an XML document. The following will work in most cases: <?xml version="1.0"?> And next, a line declaring it to be a smil 2.0 document: <!DOCTYPE smil PUBLIC "-//W3C//DTD SMIL 2.0//EN" "http://www.w3.org/2001/SMIL20/SMIL20.dtd"> The above two lines are usually called SMIL Prolog.

  8. XML Syntax • Here is a basic breakdown of xml syntax (and hence SMIL syntax): • A document is made up of elements. • Each element has either a start-tag and end-tag or an empty-element tag. • Tags are identifiers enclosed within less-than (<) and greater-than (>) characters. • Elements are ended with a forward-slash (/) character, either at the beginning of an end-tag or at the end of an empty-element tag. • Elements may have one or more attributes. Each attribute is a name/value pair in the form name=”value” (The value must be enclosed in quotes). • Elements may contain other elements (this is called nesting).

  9. XML Syntax • XML tags are case-sensitive. This means that the tags <smil> and <SMIL> are not the same. All SMIL tags are lower-case except when the tag is considered two words, in which case the second word is capitalized (as in <animateMotion>). • Empty-element tags require a forward-slash (/) at the end of the tag (before the greater-than (>) character). • Elements with a start-tag must have a corresponding end-tag.

  10. The <smil> Root Element • At the root of a smil document (usually immediately following the prolog) you should place the <smil> element. • Like the <html> element in html, it surrounds the entire document. • Unlike the <html> element, it requires at least one attribute, the xmlns (xml NameSpace): <smil xmlns = "http://www.w3.org/2001/SMIL20/Language"> </smil>

  11. The <head> and <body> Elements • Just like an html document, a SMIL document is divided into its <head> and <body>. • The <head> of the document is used to describe the content and the <body> is used to present it. • Most of a SMIL presentation is located inside of the <body>.

  12. Putting It All Together <?xml version="1.0"?> <!DOCTYPE smil PUBLIC "-//W3C//DTD SMIL 2.0//EN" "http://www.w3.org/2001/SMIL20/SMIL20.dtd"> <smil xmlns="http://www.w3.org/2001/SMIL20/Language" xml:lang="en" title="SMIL template"> <head> </head> <body> </body> </smil>

  13. Incorporating Media Objects • SMIL integrates and synchronizes multimedia. In order to do this, it uses the concept of a media object. Here are the types supported by smil 2.0: • img : A still image, just like one you would use in an html page (jpeg, gif, png, etc). • video : A video, possibly also containing audio (mpeg, avi, mov, etc). • audio : Stand-alone audio, either compressed or raw (mp3, wav, au, etc). • animation : An animation, usually using vector graphics (svg, swf, vml, etc). • text : Plain old text, promoted to the level of media object (txt, ascii, etc). • textstream : A stream of plain old text along with timing (and possibly other) information. (Think of a news ticker or subtitles.)

  14. Including Media Files (BasicMedia) • Here’s a couple simple examples of including a jpeg image and an mpeg video, respectively: <img src="picture.jpg"/> <video src="movie.mpg"/> • The above is part of the BasicMedia module (SMIL is composed of a number of XML modules such as MediaParam, MediaClipping, MediaClipMarkers, BrushMedia, MediaAccessibility, and MediaDescription modules)

  15. Making Media Accessible (MediaAccessibility) • alt - This is a brief textual description of the file, usually not even a complete sentence. • longdesc - With longdesc you can provide a link (url) to a more detailed description, from a simple sentence to a book-length document. There is no set category for the type of description. • Lets go ahead and include the two media files from earlier, this time providing some helpful information about the contents: <img src="party.jpg" alt="a picture of me from my wild bachelor party" longdesc="party.txt"/> <video src="game.mpg" alt="a movie of one of the games from my wild bachelor party" longdesc="game.txt"/>

  16. Controlling Playback (MediaClipping) • Starting 20 seconds into the video: <video src="movie.mpg" clipBegin="20s"/> • Point at which the clip stop playing: <video src="movie.mpg“ clipEnd=“50s"/> • Showing an interesting frame from the middle: <video src="movie.mpg" clipBegin="14:55.7" clipEnd="14:55.7"/>

  17. Presenting Media Serially • The element you would use in this case would be <seq>, which stands for sequence. The semantics for <seq> are very simple: it plays each child media element in order, one-at-a-time. • Nesting elements : when an element surrounds another element with its start-tag and end-tag, the surrounding element is called a parent and the surrounded one a child. • Example: three video clips. Here is how you could present them in order: <seq> <video src="ad1.mpg" alt="ad for a new computer"/> <video src="ad2.mpg" alt="ad for an internet service provider"/> <video src="ad3.mpg" alt="ad for a SMIL ad blocker"/> </seq>

  18. Presenting Media Simultaneously • In contrast to presenting media files sequentially, you can also present them all simultaneously, or in parallel. This is done by using the <par> element. • advertisement analogy: think of the newer types of ads which run during an ongoing television program (they normally occupy the lower 1/4 or 1/3 of the screen). You could say that the program and advertisement are running in parallel. Another good example of parallel presentation is the picture-in-picture feature found on some TVs. • Working with <par> is just like working with <seq> (at least at the syntactical level): <par> <video src="ad1.mpg" alt="ad for a new computer"/> <video src="ad2.mpg" alt="ad for an internet service provider"/> <video src="ad3.mpg" alt="ad for a SMIL ad blocker"/> </par>

  19. The Timing values • SMIL gives you a number of ways to specify the start and end times of media objects. This is done by adding extra attributes to a media object (and other elements, as you’ll see later). However, an element’s timing only makes sense in the context of it’s parent synchronization element. Examples of clock values: • 16 seconds (the same as "16s") • "02:45:14.273“ - 2 hours, 45 minutes, 14 seconds, and 273 milliseconds • "07:00“ - 7 minutes • "30m" - 30 minutes • "1h" - 1 hour • "1.48" - 1 second and 480 milliseconds • "1480ms" - 1480 milliseconds (the same as above)

  20. Specifying Start Times • Let’s suppose that you want to add a 2-second delay between the various advertisements in your presentation. You can do so by adding a begin attribute to the media object with a clock value: <seq> <video src="ad1.mpg" alt="ad for a new computer"/> <video src="ad2.mpg" alt="ad for an internet service provider“ begin="00:02"/> <video src="ad3.mpg" alt="ad for a SMIL ad blocker" begin="00:02"/> </seq>

  21. Synchronizing Off of Another Element <par> <!-- The following audio clip should play during all of the advertisements --> <audio src="ad_music.mp3" alt="subliminal advertising enhancer"/> <video id="ad1" src="ad1.mpg" alt="ad for a new computer"/> <video id="ad2" src="ad2.mpg" alt="ad for an internet service provider" begin="ad1.end+00:02"/> <video id="ad3" src="ad3.mpg" alt="ad for a SMIL ad blocker" begin="ad2.end+00:02"/> </par>

  22. Nesting Synchronization Elements <par> <!-- The following audio clip should play during all of the advertisements --> <audio src="ad_music.mp3" alt="subliminal advertising enhancer"/> <seq> <video src="ad1.mpg" alt="ad for a new computer"/> <video src="ad2.mpg" alt="ad for an internet service provider" begin="00:02"/> <video src="ad3.mpg" alt="ad for a SMIL ad blocker" begin="00:02"/> </seq> </par>

  23. Looping Media • Iterations: • First, you can specify how many times you would like a media file to repeat (also called the number of times it iterates) by using the repeatCount attribute: <audio src="ring.wav" alt="telephone ring“ repeatCount="4"/> • This would play the sound of a telephone ringing four times (perhaps followed by an answering machine wav). • repeatCount need not be an integer, it can also be a real number. For example, repeatCount=”3.5” is perfectly valid. • Duration: • As an alternative to repetitions, you can instead specify the total duration of the looped playback using repeatDur. For example: <audio src="ring.wav" alt="telephone ring" repeatDur="16s"/> would play the telephone ring repeatedly until sixteen seconds have elapsed (possibly cutting the phone off in mid-ring). • There is also another legal value for both repeatCount and repeatDur: ”indefinite”. This will loop a media object continuously until something causes it to stop.

More Related