Deprecated: Function ereg() is deprecated in /home3/vvaswani/db-mysql.php on line 174

Deprecated: Function split() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 60
The Melonfire Community - Trog
Logo         Community
  Trog


Copyright notice:

This article is copyright Melonfire,
Strict Standards: mktime(): You should be using the time() function instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 119
2018. All rights reserved.

All source code, brand names, trademarks and other content contained herein is proprietary to Melonfire,
Strict Standards: mktime(): You should be using the time() function instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 121
2018. All rights reserved.

Source code within this article is provided with NO WARRANTY WHATSOEVER. It is meant for illustrative purposes only, and is NOT recommended for use in production environments.

Copyright infringement is a violation of law.

Printed from http://www.melonfire.com/community/columns/trog/article.php?id=169



Learning To SMILe
Use SMIL to quickly build new Web-based multimedia applications.


Deprecated: Function eregi_replace() is deprecated in /home3/vvaswani/sql.php on line 301

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 150

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 152

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 167

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 168

Deprecated: Function split() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 170
Looking Back

For a long time, dynamic movement on a Web site meant GIF animations, which were both tedious to create and annoying after the first three repetitions. Then came Macromedia Flash, one of the cooler authoring tools for Web animation, and, with its powerful tweening toolkit, turned drab Web sites into rich landscapes of sound and colour.

Of course, in order to truly exploit Flash's capabilities, you need to know the basics of animation...not always a feasible option, especially for non-technical users who just want to put together a quick online presentation or display a series of sequentially-linked or synchronized media clips. GIF animation doesn't have the requisite power or flexibility for the needs of such users, while the dazzling array of options available in Flash tends to intimidate.

Which brings me to SMIL...


Deprecated: Function eregi_replace() is deprecated in /home3/vvaswani/sql.php on line 301

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 150

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 152

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 167

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 168

Deprecated: Function split() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 170
Getting The Tools

Let's start with the basics...what the heck is SMIL, anyway?

SMIL is the Synchronized Multimedia Integration Language, a language designed to create interactive multimedia presentations using various types of media, including audio, video, images and text. Based on XML, SMIL allows developers to synchronize and coordinate the presentation of different media files, thereby making it possible to easily and quickly create Web-based multimedia offerings.

SMIL includes supported for a wide variety of media types, including RealAudio and RealVideo, MPEG, JPEG, GIF, ASCII, HTML, AVI, WAV and AU formats. It therefore opens the door to a number of interactive Web-based multimedia applications, including interactive online presentations,

There are currently two flavours of SMIL available - SMIL 1.0 and SMIL 2.0. SMIL 1.0 was adopted by the W3C as a formal specification in 1998; this first version included a basic timing model, together with support for element layout and hyperlinks. SMIL 2.0 was formally released in 2001, with support for new animation and content control modules, enhanced layout capabilities, support for XML-based linking formats like XLink and XPointer, and a more sophisticated timing model (this tutorial uses SMIL 2.0).

Over the course of this tutorial, I'm going to show you the basics of creating an SMIL document that uses multiple media types to create a synchronized online presentation, in an attempt to offer you an alternative to the more complex tools currently available.

My tools to accomplish this are pretty basic, and available free of charge: an authoring tool, which can be any text editor, and a player to play back your SMIL presentation. A number of good players are available - take a look at the links at the end of this article for a complete list - but I'd recommend RealNetworks' RealOne player, available for download from http://www.realnetworks.com/. Get yourself a copy, and then flip the page for your first look at an SMIL file.


Deprecated: Function eregi_replace() is deprecated in /home3/vvaswani/sql.php on line 301

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 150

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 152

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 167

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 168

Deprecated: Function split() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 170
Anatomy 101

SMIL files are based on XML, and therefore inherit all the attributes (and constraints) of that toolkit. An SMIL document consists of a series of nested elements, or tags, each one controlling some aspect of the final result. As with any XML document, element names are case-sensitive, and must be correctly nested in order for the document to be well-formed.

Here's a simple SMIL document:


<smil xmlns="http://www.w3.org/2001/SMIL20/Language">;

<head>
        <layout>
                <root-layout width="500" height="400" backgroundColor="white" />
                <region id="alpha" left="120" top="150" width="250" height="200" />
        </layout>
</head>

<body>
        <img src="logo.jpg" alt="First image" region="alpha" />
</body>

</smil>


In order to see how this works, save this document with a ".smil" file extension - for example, "simple.smil" - and then pop open your copy of the RealOne player and load this file into it. Once the player parses the file, you should see something like this:

Output image

Not very exciting, huh? Don't worry - we'll jazz it up a little further down. For the moment, let's just dissect the code above and see what each of those elements actually does.

Every SMIL document must begin and end with a pair of <smil>...</smil> elements; everything contained within these elements forms part of the SMIL presentation. The XML namespace for SMIL should be included in these elements via the "xmlns" attribute.


<smil xmlns="http://www.w3.org/2001/SMIL20/Language">;
...
</smil>


The remainder of the document can broadly be divided into the <head> and the <body>, in much the same way as a regular HTML document. The <head> contains metadata (a description of the media presentation or a copyright notice) and layout information, while the <body> contains the elements that reference the actual media content or set up timers.


<smil xmlns="http://www.w3.org/2001/SMIL20/Language">;

<
head>
...
</head>

<body>
...
</body>

</smil>



Deprecated: Function eregi_replace() is deprecated in /home3/vvaswani/sql.php on line 301

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 150

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 152

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 167

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 168

Deprecated: Function split() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 170


Deprecated: Function eregi_replace() is deprecated in /home3/vvaswani/sql.php on line 301

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 150

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 152

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 167

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 168

Deprecated: Function split() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 170


Deprecated: Function eregi_replace() is deprecated in /home3/vvaswani/sql.php on line 301

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 150

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 152

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 167

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 168

Deprecated: Function split() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 170


Deprecated: Function eregi_replace() is deprecated in /home3/vvaswani/sql.php on line 301

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 150

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 152

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 167

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 168

Deprecated: Function split() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 170


Deprecated: Function eregi_replace() is deprecated in /home3/vvaswani/sql.php on line 301

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 150

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 152

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 167

Deprecated: Function ereg_replace() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 168

Deprecated: Function split() is deprecated in /home3/vvaswani/public_html/community/columns/trog/print.php on line 170


Copyright notice:

This article is copyright Melonfire,
Strict Standards: mktime(): You should be using the time() function instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 193
2018. All rights reserved.

All source code, brand names, trademarks and other content contained herein and proprietary to Melonfire,
Strict Standards: mktime(): You should be using the time() function instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 195
2018. All rights reserved.

Source code within this article is provided with NO WARRANTY WHATSOEVER. It is meant for illustrative purposes only, and is NOT recommended for use in production environments.

Copyright infringement is a violation of law.

Printed from http://www.melonfire.com/community/columns/trog/article.php?id=169



Copyright © 1998-
Strict Standards: mktime(): You should be using the time() function instead in /home3/vvaswani/public_html/community/columns/trog/print.php on line 211
2018 Melonfire. All rights reserved
Terms and Conditions | Feedback