Solved

Embedding Flash player in webpage

Posted on 2011-09-27
3
583 Views
Last Modified: 2012-05-12
I need to stream videos into the members-only area of a website.  Overall demand will be small, but it may have spikes.  Cost is a consideration for the website owner, a small professional body.

We are trialling Amazon S3 + EC2+ Cloudfront + embedded JW Player.  The S3 bucket contains two small MP4 files in the main bucket, together with a sub-folder holding:
jwplayer.js
swfobject.js (version 1.5)
player.swf

The trial page HTML is:
<!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>Streaming Trial</title>
<script type="text/javascript" src="http://biostrial.s3.amazonaws.com/jwplayer/swfobject.js"></script>
</head>
<body>
<p>Arnoldi</p>

<div id='container'>The player will be placed here</div>

<script type="text/javascript">
  var flashvars = {

    file:'Arnoldi.mp4',
    streamer:'rtmp://s2y98ylrybvg3y.cloudfront.net/cfx/st/'
  };

  swfobject.embedSWF('http://biostrial.s3.amazonaws.com/jwplayer/player.swf','container','480','270','9.0.115','false', flashvars,

   {allowfullscreen:'true',allowscriptaccess:'always'},
   {id:'jwplayer',name:'jwplayer'}

  );
</script>


<!-- <embed
	flashvars="type=rtmp&amp;streamer=rtmp://s2y98ylrybvg3y.cloudfront.net/cfx/st/&amp;file=Arnoldi.mp4">
   id="xvideo-3715"
   type="application/x-shockwave-flash"
   width="320"
   height="260"
   src="http://biostrial.s3.amazonaws.com/jwplayer/player.swf"
   quality="high"
   allowfullscreen="true"
   wmode="transparent"
</embed> -->

</body>
</html>

Open in new window


The embedding code comes from the JW player site (http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/13/embedding-flash).  The other version, commented out, is from Learning API (http://www.learningapi.com/streamingmedia-articles/amazon-cloudfront-streaming/) - it looks wrong to me, but other people seem to have made it work.

Neither work for me.  I am assuming that this is because I am doing something obviously wrong, perhaps because my knowledge of Javascript is effectively non-existent.

Where have I gone wrong?
0
Comment
Question by:hnmcc
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
3 Comments
 
LVL 29

Accepted Solution

by:
dgofman earned 500 total points
ID: 36712505
I can see two problems
1) SWFObject is case sensitivity

2) you have to use old declaration of JavaScript (base on your JS URL)

<!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>Streaming Trial</title>
<script type="text/javascript" src="http://biostrial.s3.amazonaws.com/jwplayer/swfobject.js"></script>
</head>
<body>
<p>Arnoldi</p>

<div id='container'>The player will be placed here</div>

<script type="text/javascript">
var so = new SWFObject('http://biostrial.s3.amazonaws.com/jwplayer/player.swf','jwplayer','480','270','9.0.115');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.addParam('flashvars','file=Arnoldi.mp4&streamer=rtmp://s2y98ylrybvg3y.cloudfront.net/cfx/st');
so.write('container');
</script>
</body>
</html>

Open in new window

0
 
LVL 37

Expert Comment

by:CyanBlue
ID: 37337168
This question has been classified as abandoned and is closed as part of the Cleanup Program. See the recommendation for more details.
0

Featured Post

Secure Your WordPress Site: 5 Essential Approaches

WordPress is the web's most popular CMS, but its dominance also makes it a target for attackers. Our eBook will show you how to:

Prevent costly exploits of core and plugin vulnerabilities
Repel automated attacks
Lock down your dashboard, secure your code, and protect your users

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Shoutout to Emily Plummer (http://www.experts-exchange.com/members/eplummer26.html) for giving me this article! She did most of it, I just finished it up and posted it for her :)    Introduction In a previous article (http://www.experts-exchang…
Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

726 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question