To some web designers and administrators, you may feel multifarious
to customize a flash video player for web to play all Adobe flash video
files as FLV, MP4, MOV, 3GP, 3G2, and H.264, especially when you want
to change some styles of the customized web player frequently. Then
Moyea Web Player Pro provides this solution for you for quick and
convenient customization. And this article is to show you how to
customize the web player with Xml and HTML file which are generated by
Moyea Web Player Pro.
Generally, Moyea Web Player Pro desktop would generate a SWF file as the flash video player, a Xml playlist file which controls the flash video file linked to the web player to play, a HTML file which allows change all player elements and styles settings.
Once the Xml and HTML file have been generated by using desktop of Moyea Web Player Pro, the flash video file linked to the single player for playing, the player style and all player elements settings are changeable and controllable from the Xml file and HTML file. To complete the customization of a flash video player, there must edit the Xml playlist file and edit HTML file.
With this Xml playlist file generated from Moyea Web Player Pro, you can delete, add, and replace any flash video file online or in the local computer at random to link to the single generated flash video web player for playing on the web.
To change the playlist file, you should firstly right-click the "MediaList.xml" file in the publish folder, open with notepad. The following is a playlist file opened with notepad. Totally, they are two flash video files linked to the web player for playing. "MwbtW9xhji4" and "Oq83WngmoxA"in blue are the caption of one flash video file; "MwbtW9xhji4.flv" and "Oq83WngmoxA.flv" are the name or path of the two flash video files; "FirstFrame.jpg" in green is the first image appeared for this flash video file in the web player. Besides, if you have specified, there are also "click url, click target, endurl, style of target, endtarget, etc" available for setting.
<?xml version="1.0" encoding="UTF-8"?>
<playlist>
<playitem caption="MwbtW9xhji4" path="MwbtW9xhji4.flv" image="FirstFrame.jpg" clickurl="" clicktarget="" endurl="" styleoftarget="" endtarget="" date="2008-3-31 9:24:33"/>
<playitem caption="Oq83WngmoxA" path="Oq83WngmoxA.flv" image="FirstFrame.jpg" clickurl="" clicktarget="" endurl="" styleoftarget="" endtarget="" date="2008-3-31 9:24:33"/>
</playlist>
Add new flash video file:
Step 1: Copy the flash video FLV, MP4, MOV, 3GP, 3G2, H.264 file in the same folder with the published file together with the Xml file.
Step 2: Copy one of the flash video files code in the playlist like "<playitem caption="MwbtW9xhji4" path="MwbtW9xhji4.flv" image="FirstFrame.jpg" clickurl="" clicktarget="" endurl="" styleoftarget="" endtarget="" date="2008-3-31 9:24:33"/>", and then paste it to another row.
Step 3: Later change the correspondent things, including caption, path or name, image. Of course, if you like, "click url, click target, endurl, style of target, endtarget, etc" also can be specified or changed.
Step 4: Save and refresh the changes.
Then the new flash video file has been added to the playlist to link to the web player for playing. Of course, there is no quantity limit to add to the single player to play.
Delete existing flash video file:
To delete a existing flash video file for the web player to play from the Xml file, you just delete the code like "<playitem caption="MwbtW9xhji4" path="MwbtW9xhji4.flv" image="FirstFrame.jpg" clickurl="" clicktarget="" endurl="" styleoftarget="" endtarget="" date="2008-3-31 9:24:33"/>", then the flash video file "MwbtW9xhji4.flv" would be deleted from the Xml file for the web player to play.
Replace flash video file:
From time to time, it's necessary to update the playlist for the web player to play on the web. Then you need to change or replace some flash video file for playing.
Then you just need to replace the caption, path or name, image, and some related contents of the unwanted one "MwbtW9xhji4.flv" with the correspondent contents of the wanted one "FdKQLxhiB2w.flv".
You can do any of the above listed operations on the Xml playlist file to add, delete, and replace any flash video file for the web player at random to meet your specific needs!
2. Edit HTML file:
To change the web player styles, settings, and parameters without using the desktop of Moyea Web Player,what you need to do is to embed this SWF file into a HTML page layout, and then transfer a character string named playerOpts from the SWF file path so as to make the character string named playerOpts control the action of the control bar. You can code the page layout like the following:
<!--url's used in the movie-->
<!--text used in the movie-->
<!-- saved from url=(0013)about:internet -->
<object
classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase= "http://download.macromedia.com/pub/shockwave/cabs/flash
/swflash.cab#version=7,0,0,0" width="400" height="300">
<param name=movie value="mwplayer.swf?playerOpts=targetClip*demo.flv*s">
<param name=quality value=high>
<embed src="mwplayer.swf?playerOpts=targetClip*demo.flv*s" quality=high pluginspage= "http://www.macromedia.com/shockwave/download
/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="400" height="300">
</embed>
</object>
Do you notice the mwplayer.swf in blue? It is one of those flash video web players.
The width="400" height="300" in red indicates the width and the height of your video.
The playerOpts=targetClip*demo.flv*s in red indicates the name of the FLV file to be played while demo.flv is your video. You might be curious about targetClip, the asterisk separator and the "s" in the end.
In fact, playerOpts is not that simple. PlayerOpts consists of several segments, each of which is separated by "||", and each segment contains a property of the control bar. One segment is divided into 3 parts by the asterisk (*). The first part is the property name, the second part is the property value and the third part is the data type of the property. For instance, targetClip*demo.flv*s is a segment, targetClip is the property value, demo.flv is the property name and the "s" is the character string type of this property. This segment is to specify the path from which the control bar can play the video. There are also other properties. You can set multiple properties at a time, using "||" to separate different segments, code like the following:
playerOpts=targetClip*demo.flv*s||panelColor*255,0,0*c
In this way, when you are setting the targetClip properties, you are also settingthe panelColor properties. The panelColor is the control bar color, the data type is color "c", and 255,0,0 is the RGB color. Please notice that the property name and data type are case sensitive.
The table below shows the changeable properties and their functions:
Property |
Data type |
Description |
previewBar | Character string: "s" |
Specify related flash video list templates. |
showPlayer | Boolean type: "b" |
Set to show control bar or not. Default value is true. |
playerAlign | Character string: "s" |
Set the position for the control bar; top is on the top, bottom (default) is at the bottom. |
playerOverMovie | Boolean type: "b" |
Set the control bar to be shown over the movie or not. Default value is false. |
playerAutoHide | Boolean type: "b" |
Set the control bar to hide automatically or not. Default value is false. |
hideDelay | Integer type: "i" |
Delay to hide control bar in certain milliseconds, e.g. hideDelay*1000*i |
panelColor | Color type: "c" |
Set the control bar color, e.g.: Some control bars do not include this property. Thus even if you set this property, the effect won't be shown on such control bars. |
sndMute | Boolean type: "b" |
Set the control bar to be mute or not. Default value is false. |
sndVolume | Integer type: "i" |
Set the percentage of the volume on the control bar when video starts to play. Possible values range from 0 to 100. Default value is 100. |
noMuteBtn | Boolean type: "b" |
Set to hide the mute button or not. |
noStopBtn | Boolean type: "b" |
Set to hide the stop button or not. |
noFullScreenBtn | Boolean type: "b" |
Whether it hides full screen button or not. |
noPlayListBtn | Boolean type: "b" |
Whether it hides playlist operation button or not. |
noWatchBtn | Boolean type: "b" |
Whether it hides related flash video list button or not. |
noProcBar | Boolean type: "b" |
Set to hide the process bar or not. |
noVolumeBar | Boolean type: "b" |
Set to hide the volume adjustment or not. |
noTimeText | Boolean type: "b" |
Set to hide the text about the video time or not, the form is time played / total time. |
pauseAtFirstFrame | Boolean type: "b" |
Specify whether the playing of the video pauses at the first frame, when it starts to play. True (default) indicates to pause at the first frame, while false indicates to play automatically. |
pauseAtLastFrame | Boolean type: "b" |
Specify whether the playing of the video pauses at the last frame, when it plays to the end. True indicates to pause, while false (default) indicates to return to the first frame. |
showReplay | Boolean type: "b" |
Set to show the Replay button or not. Default value is false. |
textReplay | Character string: "s" |
Set the character for the Replay button. Default value is "Replay". |
bigPlay | Character string: "s" |
Set the URL of the SWF file to display a big play button when the playing is paused or stopped. |
playBtnAlign | Character string: "s" |
The Alignment of the big play button, possible values are: top-left, top-center, top-right, left-center, center, right-center, bottom-left, bottom-center, bottom-right |
playBtnAlignX | Integer type: "i" |
Set the x ordinate of the big play button; playBtnAlign is the origin. |
playBtnAlignY | Integer type: "i" |
Set the y ordinate of the big play button; playBtnAlign is the origin. |
playBtnW | Integer type: "i" |
Set the width of the big play button. |
playBtnH | Integer type: "i" |
Set the height of the big play button. |
preLoader | Character string: "s" |
Specify the URL of the SWF file for preloader to load the entire video before playing. |
autoLoad | Boolean type: "b" |
Set to automatically load the movie or not. Note: When video is embedded to SWF file, the movie will be loaded automatically whatever the value is. |
unloadOnStop | Boolean type: "b" |
Set to unload video when the playing is stopped or not. When unloadOnStop is true, the video will be unloaded, if the stop button is clicked. If the video data is not completely downloaded, the downloaded data of the video will be eliminated from the player and the thumbnail will be shown if thumbnail is chosen, or black screen will be shown. When unloadOnStop is false, the first frame of the video will be shown and the video downloaded won't be unloaded, if the stop button is clicked. If the video is not completely downloaded, the remaining data of the video will be downloaded. |
bufferTime | Floating-point type: "f" |
Set the buffer time for the control bar; if you set 1.5, the player will buffer the data to play 1.5 seconds before playing. Default value is 5.0. |
autoHideMouse | Boolean type: "b" |
Set to automatically hide the mouse cursor or not. |
autoRewind | Boolean type: "b" |
Set to automatically rewind the video or not. Default value is false. |
minWidth | Integer type: "i" |
The minimum width permitted. When the width of the player is less than the minimum width, the two vertical sides of the video will be cut off, instead of being stretched to match the width of the player. Default value is 0, i.e. the width of the video will be consistent with the width of the player. |
minHeight | Integer type: "i" |
The minimum height permitted. When the height of the player is less than the minimum height, the two horizontal sides of the video will be cut off, instead of being stretched to match the width of the player. Default value is 0, i.e. the height of the video will be consistent with the height of the player. |
thumbNail | Character string: "s" |
Specify the video thumbnail, which will be loaded before the video is played. |
keepAspect | Boolean type: "b" |
Set to keep aspect ratio of the video or not when the video is stretched. Default value is false. |
playerExt | Character string: "s" |
Set the URL of the SWF file, which is a player extension. When the video is loading, the swf specified by playerExt will be loaded by the player, and the swf file will implement the extension function. |
movieID | Character string: "s" |
Set an ID for the video, which will be passed to onPlayURL. |
onPlayURL | Character string: "s" |
The URL to be accessed when the video starts to play. A parameter named movieID will be passed to this URL. Note: No browser window will pop up when this URL is accessed. |
fscEvent | Boolean type: "b" |
Set to transfer the player event to fscommand or not. When the value is true, the player event will be transferred to fscommand(t, n); t is the event type. When using the player provided by Flash Video MX, t is MoyeaPlayer persistently; n is event name. |
playListPath | Character string: "s" |
Specify to play playlist file. |
playItem | Integer type: "i" |
Directly specify to play which item in playlist. |
Generally, after the change and customize the Xml playlist file and Html file generated from Moyea Web Player Pro, all the elements of the web player have been completed customizing, which would give you the same effects with using the desktop of Moyea Web Player Pro or Lite. Thus the flash video web player also would appear the brand new look in front of you.
Then if you are a web designer, administrator, or a person who wants to make a video share site like YouTube, save much time on making a web player, Moyea Web Player Pro is really the best solution.
.
- Windows NT4.0 + SP6/2000/XP or above
- 64MB Memory (128MB recommended) & 512MB hard disc space or above
- Microsoft DirectX 8.1 or above & Quick Time file supported Quick Time 6.0 or above
- Windows Media Player 9.0 or above & Flash Player 9 or above
- Internet Explorer 7.0 or above recommended