Flash Video (.FLV) Streaming Guide for Macromedia Dreamweaver users

If your media clips are not already in flash video format, you will need to encode them into .FLV files. You can use Adobe Flash Video Encoder or any other FLV encoder for this. If you do not have an FLV encoder, you can download and use Riva FLV Encoder free from http://www.rivavx.com/?encoder.

A commercial FLV encoder which is highly regarded in the Flash community is Sorenson Squeeze: http://www.sorensonmedia.com

For a list of encoders listed on download.com, click here.

How to encode your clips using Adobe Flash Video Encoder:
 

Start Adobe Flash Video Encoder.

Drag any video clips you want to encode into the queue (or use the 'Add' button):



Click on 'Settings' and under 'Encoding Profiles' select the desired bit rate (default should be Medium Quality).



Click on 'Video' and set the 'Video codec' to 'On2 VP6'.



Click 'OK'.

Click 'Start Queue' to start the encoding process. The encoded Flash video (.FLV) files will be saved on your computer.

 

Uploading your flash videos (.FLV files): Your flash videos (.FLV files) must be uploaded into the folder called 'videos' under your account. The path to the 'videos' folder is: public_html / flash_stream / apps / streams / videos / e.g.   public_html/flash_stream/apps/streams/videos/clip1.flv   public_html/flash_stream/apps/streams/videos/clip2.flv   public_html/flash_stream/apps/streams/videos/clip3.flv   etc ...

What are the .swf and .html files used for?

• An .SWF file: This file contains all images, sounds and vector data necessary to play the video clip. Dreamweaver will automatically generate this file for you.
• An .HTML file: This file will contain the HTML code necessary to play the video clip. Dreamweaver will automatically generate this file for you.

To create these two files, please follow these instructions:

Start Macromedia Dreamweaver and create a new HTML document.

Select 'Insert' -> 'Media' -> 'Flash Video'



Dreamweaver will now prompt you to save your HTML document because it needs to be saved to drive before a flash video component can be added. It is best to create an empty folder to save the document in.

Once your document is saved, a window titled 'Insert Flash Video' will pop up.

• Change the 'Video type' from 'Progressive Download Video' to 'Streaming Video'.
• For 'Server URI' parameter, enter:
  
  rtmp://Your_Domain_or_IP/apps/videos/
  
  Replace 'Your_Domain_or_IP' with your domain name (do not include the www. portion!). If your account has been assigned a dedicated IP address, you can enter the IP address instead of your domain name.
   

  PLEASE NOTE: Notice that there is no reference to the streams/ directory in the URI. This is not a mistake.



• For 'Stream name', enter the name of the .FLV file you uploaded (e.g. myclip.flv).

Change any other variables as you see fit and click on OK to close the dialog. You should now see something like this:
 

You can preview the streaming video on your browser by selecting 'File' -> 'Preview in Browser'.



 

Troubleshooting Tip: Video clip not playing? Your Flash player has a built-in security measure which prevents flash documents residing locally on your computer from accessing video clips residing on the internet. To make an exception, you will need to change the 'Global Secuity Settings' of your Flash player. Here's how: Select either Firefox or IExplorer from the 'File' -> 'Preview in Browser' menu in Dreamweaver to preview your document. Right click your mouse on the flash player window inside the browser and select 'Settings...'. Note that the video player window might not be visible if your document background is white!   A small window will pop-up. Click on the 'Advanced' button.   A new web page titled 'Flash Player Help' will open up in a new browser window. Click on the 'Glabal Security Settings Panel' link on the left hand side.   Click on the 'Edit locations...' pulldown menu and select 'Add location...'. Type in host.onyxservers.com and click 'Confirm'. General audience note: Enter the address to your 'Flash Media Server' server.   Change the option 'Always ask' to 'Always allow'.   Close the 'Flash Player Help' web page and try selecting 'File' -> 'Preview in Browser' again from within Dreamweaver. Your Flash player should now be able to connect to the server from your computer.

If everything is working well, the video clip will start streaming.

Dreamweaver saves the FLV player in the form of one or more files with the extension .swf. These files need to be uploaded to your media streaming account. To view the name of these SWF files, select the flash video instance you created and click on the link titled 'Show required files...'.



You can upload the .swf and .html files generated by Dreamweaver anywhere under your public_html/ folder. These files do not need to be uploaded into your flash_stream/ folder. Just make sure they reside in the same folder (unless you have changed the path to the SWF file in the HTML code).

PLEASE NOTE: If uploading your files using the webcontrol file manager tool, the public_html/ folder is referred to as the 'web root'.
 

What about a main.asc file?  Don't I need to upload a main.asc file? No, because we have already placed a main.asc file in your account. It is located in public_html/flash_stream/apps/main.asc A main.asc file is a simple template Flash Action Script text file which helps the flash server feed the video file to the client when a request comes in. A main.asc file is required for FLV players to stream your flash videos. The one we have placed in your account should work fine with your Dreamweaver FLV player, but if there are any problems you can replace our copy of main.asc with the one generated by Dreamweaver.

You can now watch your video stream by pointing your browser to the Dreamweaver generated .html file.

To embed the video into your web pages, copy and paste the code found inside the .html file.