News:

Wondering if this will always be free?  See why free is better.

Main Menu

Embedding FLV / SWF Movies

Started by Moif, July 08, 2008, 08:25:19 AM

Previous topic - Next topic

Moif

Hi,

We use Karls most excellent Auto Embed Video Mod on our site which is fantasic for Youtube videos and that kind of thing. However, it doesn't appear to work with FLV or SWF conversions of movies taken on cameras and phones and hosted on private sites as a file upload. I've attempted to embed the clips using the BBC code but again, no go. I'm ideally looking for a player that will tell you it's loading and to have some control with playback etc.

Is there a mod or any way to get this kind of functionality in 1.1.5?




Moif

Hi Karl,

Will that conflict with your other mod that we're using?



N3RVE

Quote from: moif on July 10, 2008, 05:25:55 AM
Will that conflict with your other mod that we're using?

What's the name of this mod?

-[n3rve]
Ralph "[n3rve]" Otowo
Former Marketing Co-ordinator, Simple Machines.
ralph [at] simplemachines [dot] org                       
Quote"Somewhere, something incredible is waiting to be known." - Carl Sagan

Moif




Moif

In fact, I've just tried and it won't play FLVs hosted on my own server.

Back to the drawing board...



Rumbaar

Try a google search:
http://www.google.com.au/search?q=flv+player+html
You might have to work on getting it incorporated into your site, and not sure if it will be able to be posted directly into posts.  Admin HTML tag at the very least.
"An important reward for a job well done is a personal sense of worthwhile achievement."

[ Themes ]

tertunc

Open your favorite text editor (mine is Dreamweaver MX 2004, but notepad will also work). In this part we will make two Web pages. One will hold our flash movie, and the other one will be used for selecting the MP3/FLV songs. So let's create them.

Write the following codes in your text editor and save the file as "Player.html" in the same folder where you saved your flash movie (MyMP3/FLVPlayer.swf):

    <html>
    <head>
    <title>Welcome To My MP3/FLV Player</title>
    </head>
    <body>
    <script language="JavaScript" >
    <!--
    function MM_openBrWindow(theURL,winName,features) { //v2.0
      window.open(theURL,winName,features);
    }
    -->
    </script>
    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/
    shockwave/cabs/flash/swflash.cab#version=7,0,0,0" name="movie" width="300" height="400" align="left" id="movie">
      <param name="allowScriptAccess" value="sameDomain" >
      <param name="movie" value="MyMP3Player.swf" >
      <param name="menu" value="false" >
      <param name="quality" value="high" >
      <param name="scale" value="noborder" >
      <param name="salign" value="lt" >
      <param name="wmode" value="transparent" >
      <param name="bgcolor" value="#000000" >
      <embed src="MyMP3Player.swf" menu="false" quality="high" scale="noborder" salign="lt" wmode="transparent" bgcolor="#000000" width="300" height="400" swliveconnect=true id="movie" name="movie" align="left" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" >
    </object>
    <br>
    </body>
    </html>

Save this file as Player.html.

This is just a simple html page that contains some conventional HTML tags like <html>, <head>, and <body>. There is another tag in these codes called the <object> tag. This code holds your flash movie. The information which is written in the <object> tag is also written in another tag nested in the <object> tag, called the <embed> tag. Why are we using both <object> and <embed> tags, since both of them have the same properties? Actually, we are using them because of the clash between Microsoft Internet Explorer and Netscape Navigator. The <object> tag is supported in Internet Explorer and the <embed> tag is supported in Netscape Navigator--but not in Internet Explorer. In this way, our player would be accessible from both Internet Explorer and Netscape Navigator (now Mozilla).

Along with the conventional HTML tags, there is a code block of java script present that is:

    <script language="JavaScript">
    <!--
    function MM_openBrWindow(theURL,winName,features) { //v2.0
      window.open(theURL,winName,features);
    }
    -->
    </script>

This block is here because, working on the Flash side, we dragged a button instance on stage and added some codes to that which were something like getURL(bla blab );la ...  That code was added to trigger this JavaScript. This JavaScript launches another page called "url.html", an HTML file that we will use to browse our directories in search of MP3/FLV files. When you have saved the first file as Player.html, create a new file in your text editor and type following codes in it:

    <html>
    <head>
    <title>Select MP3/FLV Files Only Please</title>
    <script language="javascript">
    function fill(file){
    window.opener.movie.SetVariable("fName", file);
    window.close();
    }
    </script>
    </head>

    <body>
    <form id="form1" method="post" enctype="multipart/form-data" name="form1">
      Select an MP3/FLV &amp; Add to playlist. <br>
      <input name="file" type="file" accept="audio/basic">
    <br>
    <input type="submit" onClick="fill(file.value)" value="Add to list...">
    </form>
    </body>
    </html>

Save this file as "url.html" where you saved the Player.html and MyMP3/FLVPlayer.swf.

Now I will describe how this page works. Let's start from the <body> tag. The <body> tag contains a simple form in which we have placed a file browsing field named "file" and a Submit button. By clicking on the "browse" button of the file field we will select our desired MP3/FLV File(we can select other files as well, but don't select any file other then MP3/FLV Audios). When someone clicks on the Submit button, it will execute a JavaScript function called "fill()" that is written in the head area of our URL.HTML file. While executing that function, we are also sending some information to that function. See the "onClick" event in the Submit button's coding where we are executing the function as:

    onClick="fill(file.value)"

where onClick is the event. When some one clicks on the button (submits the form), a function called fill(file.value) is triggered where "file.value" is the text (path to selected file) written in the file browsing field and fill is the name of the function which we are triggering.

Now I will explain how the "fill" function works. It receives  the value from the file field and sets the value of the "fName" variable of the flash movie which is present in our main page (i.e. Player.html). Here in the line window.opener.movie.SetVariable("fName", file);, window.opener means our main page, which was the responsible for opening this new window.

Here you have noticed that we are setting the value of a variable which is present in our Flash movie by using JavaScript. For this we are using the movie.SetVariable method. The actual syntax of this method is:

    Name_of_Movie.SetVariable("name of variable in flash movie");

Where "name of variable in Flash movie" is the value we want to set using the JavaScript script.

NOTE: Here you should remember that name of movie means the name that we given to our movie in <object> or <embed> tag, for example id="movie" or name="movie" not src="MyMP3Player.swf"

Now preview Player.html in your browser and check it. If everything is going fine then you have followed the tutorial perfectly. If not, you have missed something or done something wrong, so check your codes in both the pages and in your Flash movie; also check that you have given the same name as we mentioned in this tutorial because both Action script and JavaScript are case sensitive, so in both scripts "FNAME", "fNAME", "Fname" and "fName" are four different things.

Conclusion:

In this tutorial, we learned a little bit about how to talk with JavaScript using Flash MX 2004 and vice versa. There is another method called "fscommand" in flash by which we can talk to JavaScript or VB. There are some limitations in this tutorial, such as that the user can select any file other then MP3/FLV file, which will cause flash movie to stop working. This can be solved by using advanced validations of JavaScript or Flash's Action Script.

DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.

http://www.devarticles.com/c/a/Flash/Making-an-MP3-FLV-Player-with-Flash-MX-2004-and-JavaScript/3/

Rumbaar

I recommend using a better text editor, like Notepad++.
"An important reward for a job well done is a personal sense of worthwhile achievement."

[ Themes ]

Advertisement: