Home arrow JavaScript arrow Page 11 - JavaScript and Embedded Objects
JAVASCRIPT

JavaScript and Embedded Objects


There's more to Web browsers than (X)HTML, CSS, and JavaScript. ActiveX, plug-ins, and other embedded objects help make the Web what it is today. Get the scoop on these and more in this chapter excerpt from JavaScript: The Complete Reference, second edition, by Thomas Powell and Fritz Schneider McGraw-Hill/Osborne, ISBN 0072253576.

Author Info:
By: McGraw-Hill/Osborne
Rating: 4 stars4 stars4 stars4 stars4 stars / 92
October 26, 2004
TABLE OF CONTENTS:
  1. · JavaScript and Embedded Objects
  2. · Java
  3. · Including Applets
  4. · Accessing Applets in JavaScript
  5. · Issues with JavaScript-Driven Applets
  6. · Plug-ins
  7. · MIME Types
  8. · Detecting Specific Plug-Ins
  9. · Interacting with Plug-Ins
  10. · Refreshing the Plug-Ins Array
  11. · Interacting with a Specific Plug-In
  12. · ActiveX
  13. · Cross-Browser Inclusion of Embedded Objects
  14. · Interacting with ActiveX Controls
  15. · Summary

print this article
SEARCH DEVARTICLES

JavaScript and Embedded Objects - Interacting with a Specific Plug-In
(Page 11 of 15 )

Nearly everything that was true of applet interaction remains true for plug-ins as well. Applets are accessed through the Document object, using the applet’s name or id attribute. Similarly, the plug-in handling data embedded in the page is accessed by the name attribute of the <embed> tag that includes it. As with applets, you need to be careful that you do not attempt to access embedded data before it is finished loading. The same technique of using the onload handler of the Document to set a global flag indicating load completion is often used. However, one major difference between applets and plug-ins is that as far as the DOM specification is concerned, the <embed> tag doesn’t exist, nor do plug-ins. Despite the fact that their use, particularly in the form of Flash, is so widespread, the specification chooses not to acknowledge their dominance and try to standardize their use.

To illustrate interaction with plug-ins, we show a simple example using a Macromedia Flash file. The first thing to note is that there are two plug-in names corresponding to Flash players capable of LiveConnect interaction. They are “Shockwave Flash” and “Shockwave Flash 2.0.” Second, consulting Macromedia’s documentation reveals that the <embed> tag should have its swliveconnect attribute set to true(though it does not appear to be required for this example) if you wish to use JavaScript to call into the Flash player.

You can find a list of methods supported by the Flash player at Macromedia’s Web site (for example, at http://www.macromedia.com/support/flash/publishexport/
scriptingwithflash/
). The methods we will use in our simple example are GotoFrame(), IsPlaying(), Play(), Rewind(), StopPlay(), TotalFrames(), and Zoom(). The following example controls a simple Flash file extolling the wonders of JavaScript.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Simple Flash control example (Netscape and Mozilla only)</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
<!--
var pluginReady = false;
var pluginAvailable = false;
if (document.all) alert("Demo for netscape only");
function detectPlugin()
{
  // if the appropriate plugin exists and is configured
  // then it is ok to interact with the plugin
  if (navigator.plugins &&
   
((navigator.plugins["Shockwave Flash"] &&
     
navigator.plugins["Shockwave Flash"]["application/x-shockwave-flash"])
  ||
     (navigator.plugins["Shockwave Flash 2.0"] &&
      navigator.plugins["Shockwave Flash 2.0"]["application/x-shockwave-flash"]))
    )
  pluginAvailable = true;
}

function changeFrame(i)
{
  if (!pluginReady || !pluginAvailable)
    return;
 
if (i>=0 && i<document.demo.TotalFrames())
    // function expects an integer, not a string!
   
document.demo.GotoFrame(parseInt(i));
}

function play()
{
  if (!pluginReady || !pluginAvailable)
    return;
  if (!document.demo.IsPlaying())
   
document.demo.Play();
}
function stop()
{
 
if (!pluginReady || !pluginAvailable)
    return;
  if (document.demo.IsPlaying())
   
document.demo.StopPlay();
}
function rewind()
{
  if (!pluginReady || !pluginAvailable)
    return;
  if (document.demo.IsPlaying())
    document.demo.StopPlay(); 

  document.demo.Rewind();
}
function zoom(percent)
{
  if (!pluginReady || !pluginAvailable)
    return;
 
if (percent > 0)
    document.demo.Zoom(parseInt(percent));
    // method expects an integer
}
//-->
</script>
</head>
<body onload="pluginReady=true; detectPlugin();">

<!-- Note: embed tag will not validate against -->
<embed id="demo" name="demo"
src="http://demos.javascriptref.com/jscript.swf" width="318" height="300" play="false" loop="false" pluginspage="http://www.macromedia.com/go/getflashplayer" swliveconnect="true"></embed>

<form name="controlform" id="controlform" action="#" method="get">
<input type="button" value="Start" onclick="play();" />
<input type="button" value="Stop" onclick="stop();" />
<input type="button" value="Rewind" onclick="rewind();" /><br />
<input type="text" name="whichframe" id="whichframe" />
<input type="button" value="Change Frame"
onclick="changeFrame(controlform.whichframe.value);" /><br />
<input type="text" name="zoomvalue" id="zoomvalue" />
<input type="button" value="Change Zoom"
onclick="zoom(controlform.zoomvalue.value);" />
(greater than 100 to zoom out, less than 100 to zoom in)<br />
</form>
</body>
</html>

The example—stopped in the middle of playback and zoomed in—is shown in Figure 18-6.


FIGURE 18-6
The scriptable Flash plug-in lets us zoom in on the Flash file.

There exist far more powerful capabilities than the previous example demonstrates. One particularly useful aspect of Flash is that embedded files can issue commands using FSCommand() that can be “caught” with JavaScript by defining an appropriately named function. Whenever an embedded Flash file in a LiveConnect-enabled browser issues an FSCommand(), the Flash file crosses over into browser territory to invoke the name_doFSCommand() method if one exists. The name portion of name_doFSCommand() corresponds to the name or id of the element in which the object is defined. In the previous example, the Flash file would look for demo_doFSCommand() because the file was included in an <embed> with name equal to “demo.” Common applications include alerting the script when the data has completed loading and keeping scripts apprised of the playback status of video or audio. As with other more advanced capabilities, details about these kinds of callback functions can be obtained from the plug-in vendors.

McGraw-Hill-OsborneThis chapter is from JavaScript: The Complete Reference, second edition, by Thomas Powell and Fritz Schneider, McGraw-Hill/Osborne, ISBN: 0072253576). Check it out at your favorite bookstore today.

Buy this book now.


blog comments powered by Disqus
JAVASCRIPT ARTICLES

- Project Nashorn to Make Java, JavaScript Wor...
- JavaScript Virus Attacks Tumblr Blogs
- Google Releases Stable Dart Version, JavaScr...
- Khan Academy Unveils New JavaScript Learning...
- Accessing Nitro? There`s an App for That
- JQuery 2.0 Leaving Older IE Versions Behind
- Fastest JavaScript Engine Might Surprise You
- Microsoft Adjusting Chakra for IE 10
- Brendan Eich: We Don`t Need Google Native Cl...
- An Overview of JavaScript Statements
- An Overview of JavaScript Operators
- Overview of JavaScript Variables
- More of the Top jQuery Social Plugins
- The Top jQuery Social Plugins
- More of the Top jQuery Slider Plugins

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 

Developer Shed Affiliates

 




© 2003-2017 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials