YOUR FEEDBACK
IBM Buys Its Way Out of Antitrust Trouble
Plato wrote: L.L.Bean was never actually a customer of PSI. At most, they we...


2007 West
GOLD SPONSORS:
Active Endpoints
Your SOA Needs BPEL for Orchestration
BEA
Virtualized SOA: Adaptive Infrastructure for Demanding Applications
Nexaweb
Overcoming Bandwidth Challenges with Nexaweb
TIBCO
What is Service Virtualization?
SILVER SPONSORS:
WSO2
Using Web Services Technologies and FOSS Solutions
Click For 2007 East
Event Webcasts

2008 East
PLATINUM SPONSORS:
Appcelerator
Think Fast: Accelerate AJAX Development with Appcelerator
GOLD SPONSORS:
DreamFace Interactive
The Ultimate Framework for Creating Personalized Web 2.0 Mashups
ICEsoft
AJAX and Social Computing for the Enterprise
Kaazing
Enterprise Comet: Real–Time, Real–Time, or Real–Time Web 2.0?
Nexaweb
Now Playing: Desktop Apps in the Browser!
Sun
jMaki as an AJAX Mashup Framework
POWER PANELS:
The Business Value
of RIAs
What Lies Beyond AJAX?
KEYNOTES:
Douglas Crockford
Can We Fix the Web?
Anthony Franco
2008: The Year of the RIA
Click For 2007 Event Webcasts
SYS-CON.TV
MXDJ TOP LINKS YOU MUST CLICK ON !


Delivering Captivate Content on the Web
Jesse Warden´s utility: CaptivatePlayer

Digg This!

Page 2 of 2   « previous page

Advanced authors can specify these options in the index.html file that calls the CaptivatePlayer.swf file, but the XML file takes precedence.

The following example is a typical web deployment.

Figure 6. For a typical web deployment, the folder would contain these files

Figure 7. For a typical executable deployment, the folder would contain these files

How to Use the Play List XML File
Before you get nervous, remember that XML files are just text files. You can edit them in Notepad, WordPad, Microsoft Word, or any other text editor. I prefer Macromedia Dreamweaver because it color codes my XML nodes, aiding readability. The following is the XML file in Dreamweaver:

<?xml version="1.0" encoding="iso-8859-1"? >

  <captivate_playlist
   autoplay="true"
    "volume="50"
     content="true">

     <swf src="demonstration1.swf" name="Introduction">
     <swf src="demonstration2.swf" name="How To Do">
     <swf src="demonstration3.swf" name="Conclusion">

  </captivate_playlist>

</xml>

When CaptivatePlayer uses the XML file excerpted in Figure 8, CaptivatePlayer performs the following actions:

  • Automatically starts playing the first SWF file
  • Sets the volume to 50%
  • Scales the Captivate SWF file to fit to the size the CaptivatePlayer
  • Puts demonstration1.swf, demonstration2.swf, and demonstration3.swf into the menu, but uses the names Introduction, How To Do, and Conclusion
Listed below are the options for each of the attributes.

Attributes for the captivate_playlist tag Value
autoplay true or false. Defaults to "true."
volume 0-100
scalecontent true or false. Defaults to "true."

In the code sample above, the SWF source tag has a specified name attribute. You could have used the SWF file name, but "Introduction" is more intuitive to the user than demonstration1.swf. If you want to add more Captivate SWF files, you simply add another SWF tag in the XML file, just like the examples provided. You can add as many SWF tags as you like, but you must have at least one SWF tag always present.

How to Use the index.html File
I included a default index.html file for authors with either a Flash or ColdFusion background. First, for those in a hurry, the HTML is already written for you; the CaptivatePlayer is embedded into the HTML with the necessary code to make it play in the full screen in the browser. Second, for those incorporating CaptivatePlayer into their own website design, you can copy and paste the code for embedding CaptivatePlayer.

For more details, refer to readme_index.txt, included in the ZIP file you downloaded in the Requirements section. It explains in detail how to customize and use the index.html file.

The CaptivatePlayer Source Files
There are many ways you can use CaptivatePlayer (as an embedded SWF file in HTML or as an EXE file) and it can be confusing understanding all the files included in the ZIP file that accompanies this article.

After unzipping the archive, the base level directory has two folders and three files (Figure 10).

Figure 8. The contents of the ZIP file, unzipped

For Flash Developers who need to use the CaptivatePlayer in an existing Rich Internet Application, the necessary files are in the "Flash MX 2004 Install" folder. Included is the MXP, which installs the CaptivatePlayer as a component in the Components Panel. I've included the MXI and SWC for Flash Developers who need those instead.

Figure 9. The three files in the Flash MX 2004 Install folder

For Flash Developers who have more specific needs to customize CaptivatePlayer, the "Source Files" folder contains the FLA file, created in Flash MX 2004 and source AS (ActionScript) files. This folder contains everything a Flash Developer needs to customize the design of the CaptivatePlayer, tweak the way it works, add functionality, and/or compile a customized version. A default setup file, used to initialize the CaptivatePlayer, is included in the includes folder.

Figure 10. The files in the Source Files folder

Back to top
Where to Go from Here
Macromedia Captivate is the easiest and most flexible way to create interactive demonstrations and software simulations. It is fun to use, does the hard work for you, and lets you spend more time focusing on polishing up your tutorial, simulation, demonstration, or test to make it more effective. Because I have prior experience creating these types of presentations manually in Flash, I know that Captivate significantly reduces the amount of time and work required to create these demonstrations and simulations. I hope that CaptivatePlayer complements your workflow by providing a final, easy step in deploying your finished work for your users online, on an intranet, or even running locally, off of another user's machine.

In talking to Captivate authors from all over the USA, from Canada to Germany, by phone and e-mail, I can definitely say there is room to grow and improve the way the CaptivatePlayer deploys Captivate movies. One author has requested that I add a global control bar instead of having Captivate generate one for each demonstration or simulation. This would help end users quickly access other Captivate content, not just locations inside one demonstration or simulation. Other authors, who have lot of Captivate content, called modules, also have sub-modules. They prefer the current menu to contain nested menus, like most context menus do today (File > New or Right click > Properties for example). This is especially ideal for users, because a volume of 50-100 Captivate demonstrations or simulations does not fit well into a one-level menu.

Creating these demonstrations or simulations is only part of the process. I created CaptivatePlayer to fulfill a need to deliver Captivate content quickly to users. There is still room for improvement as I have mentioned, so if the CaptivatePlayer does not satisfy your deployment needs, please do send me feedback.

Notes from the Author:

  1. You can see CaptivatePlayer in action. The following is a tutorial I created for creating a Flash MX 2004 component: dev.jessewarden.com/captivate/flashcomponents/main.html.
  2. To request changes in the next version of Captivate, go to: www.macromedia.com/go/wish/.


Page 2 of 2   « previous page

About Jesse Randall Warden
Jesse R. Warden, a member of the Editorial Board of Web Developer's & Designer's Journal, is a Flex, Flash and Flash Lite consultant for Universal Mind. A professional multimedia developer, he maintains a Website at jessewarden.com where he writes about technical topics that relate to Flash and Flex.

LATEST FLEX STORIES & POSTS
Adobe's Kevin Lynch and Microsoft's Scott Guthrie to Keynote AJAX World RIA Conference & Expo
Two of the biggest launches in Rich Internet Application history took place in 2007/2008 when Adobe launched AIR 1.0 in February '08 and Microsoft launched Silverlight (September '07). At the 6th International AJAXWorld RIA Conference & Expo in October SYS-CON Events is delighted to be
Google and Yahoo Can X-Ray Your SWF Now
Adobe announced a collaboration with search industry leaders to dramatically improve search results of dynamic Web content and rich Internet applications.
DreamFace Interactive Delivers Mashup Kit: DreamFace-Fx for Adobe Flex
Following the private Beta release last month, DreamFace Interactive announced the general availability of the DreamFace-Fx Mashup Kit for Adobe Flex. As promised, DreamFace-Fx is the first Mashup Kit to reach developers in a comprehensive roadmap which will extend the DreamFace Open S
Integration between Flex and AJAX made easy
Flex is a great way to introduce rich Internet applications in your enterprise. But in the real world, you often have to do it gradually. Majority of the business units of any enterprise who are sold on RIA would prefer adding Flex-based components to their old but working Web 1.0 app
AJAX and Enterprise RIA Tools - JSF, Flex, and JavaFX
2008 is going to be an important year for Rich Internet Applications. Most organizations are delivering or planning to deliver Rich Internet Applications; however, at the same time, most IT managers are facing a dilemma: which Rich Internet Application technology and platform to use? T
Adobe Releases Significantly Enhanced LiveCycle ES
Adobe has released a substantially enhanced BPM/RIA solution. While LiveCycle suite isn't new software, its popularity increased in June of 2007 when the entire suite started to run on the same J2EE server and the RIA components were introduced. Today, over 5,000 enterprises use LiveCy
SUBSCRIBE TO THE WORLD'S MOST POWERFUL NEWSLETTERS
SUBSCRIBE TO OUR RSS FEEDS & GET YOUR SYS-CON NEWS LIVE!
Click to Add our RSS Feeds to the Service of Your Choice:
Google Reader or Homepage Add to My Yahoo! Subscribe with Bloglines Subscribe in NewsGator Online
myFeedster Add to My AOL Subscribe in Rojo Add 'Hugg' to Newsburst from CNET News.com Kinja Digest View Additional SYS-CON Feeds
Publish Your Article! Please send it to editorial(at)sys-con.com!

Advertise on this site! Contact advertising(at)sys-con.com! 201 802-3021

SYS-CON FEATURED WHITEPAPERS

ADS BY GOOGLE