How to edit flash video player with code?
PlayerDIY Web Player is a graphical program for customizing skinning flash video player for web, and the generated flash video player definitely can be easily edited on its graphical interfaces. However, in order to make player users could conveniently build video sharing site, PlayerDIY Web Player also offers a solution to make payer users could edit the player with HTML, and could implement playing a specific video in a new page (have a look at the example) in video sharing sites.
Here, the example below will teach you how to edit the flash video player generated with PlayerDIY Web Player with HTML.
Example:
After publish your custom flash video player with PlayerDIY Web Player, you can get the following embed code of it on the published index.html file.
<script type="text/javascript" src="swfobject.js"></script>
<div id="flashcontent">Player will show here</div>
<script type="text/javascript">
var so = new SWFObject('mwplayer.swf','player','500','450','9');
so.addParam('wmode','opaque');
so.addParam('quality','high');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.write("flashcontent");
</script>
1. <div id="flashcontent">Player will show here</div> means after embedding the generated flash video player onto webpage, the player will show between tag <div> and </div>.
2. mwplayer.swf is the actual flash video player, and the path of it can be changed via this parameter, e.g.:” /players/mwplayer.swf” means the player resides in a folder named "players".
3. 500 is the width of the player, and 450 is the height of the player, so the player size can be changed by changing them.
4. Other properties about the generated flash video player (like the property of playlist, skin, playback, etc) also can be edited by adding so.addParam, for example:
1). If add “so.addParam('flashvars','playerOpts=previewBar*black.swf*s||pauseAtFirstFrame*false*b');” between “so.addParam('allowscriptaccess','always');” and “so.write("flashcontent");”, it means the player will have a playlist and, the playlist is black. And the video in the player can be played automatically.
2). If add “so.addParam('flashvars','playerOpts=playItem*0*i||pauseAtFirstFrame*false*b');” between “so.addParam('allowscriptaccess','always');” and “so.write("flashcontent");”, the player will automatically play the first video of the playlist.
3). If add “so.addParam('flashvars'','playerOpts=playListPath*^^../videos/myvideo.flv^../videos/myvideo.jpg*s||pauseAtFirstFrame*false*b
||noWatchBtn*true*b||noPlayListBtn*true*b');” between “so.addParam('allowscriptaccess','always');” and “so.write("flashcontent");”, it means the player will automatically play a video named myvideo.flv whose thumbnail named myvideo.jpg and they are inside the “videos” folder. And the player has no the previous, next and playlist icons on the control bar.
According to the examples above, we could know that each added parameter (e.g.:pauseAtFirstFrame*false*b) includes three parts, they are: 1. the property name "pauseAtFirstFrame"; 2. the value of the property "false" between "*"; 3. the data type of the property "b". And each parameter is separated with "||".
Note: No line break in the so.addParam code.
Property Definitions:
Property | Data type | Description |
---|---|---|
previewBar | Character string: "s" | Specify the playlist style. |
ShowListAtFirst | Boolean type: "b" | Set whether show playlist at first frame or not before video playing. Default value is true. Note: This option will not take effect if "Pause at first frame" option is unchecked |
ShowListAtMidst | Boolean type: "b" | Set whether show playlist or not during video playing. Default value is false. |
ShowListAtLast | Boolean type: "b" | Set whether show playlist or not at the last frame. Default value is true.
Note: This option will not take effect if "Pause at last frame" option is unchecked |
playListCache | Boolean type: "b" | Set whether make browser using the cached playlist or not. Default value is true. |
UserDefArea | Character string: "s" | Set whether show something or not, and show what, at the right of the player. Default value is embed(hs).swf. If don’t want to show anything. The parameter is playerOpts=UserDefArea**s Learn more about this property. |
noMuteBtn | Boolean type: "b" | Set whether hide sound icon or not. Default value is false. |
noStopBtn | Boolean type: "b" | Set whether hide stop icon or not. Default value is false. |
noFullScreenBtn | Boolean type: "b" | Set whether hide full-screen icon or not. Default value is false. |
noPlayListBtn | Boolean type: "b" | Set whether hide the previous and next icons or not. Default value is false. |
noWatchBtn | Boolean type: "b" | Set whether hide playlist icon or not. Default value is false. |
noProcBar | Boolean type: "b" | Set Whether hide process bar or not. Default value is false. |
noVolumeBar | Boolean type: "b" | Set whether hide volume bar or not. Default value is false. |
noTimeText | Boolean type: "b" | Set whether hide video time or not. Default value is false. |
panelColor | Color type: "c" | Set the control bar color, e.g.: panelColor*255,0,0*c indicates to set the control bar color to be red; 255,0,0 is for the color components R, G, B. Note: The color only works when the control bar is transparent. |
playerOverMovie | Boolean type: "b" | Set whether show control bar over video or not. Default value is false. |
playerAutoHide | Boolean type: "b" | Set whether hide control bar or not. Default value is false. |
hideDelay | Integer type: "i" | Delay to hide control bar in certain milliseconds, e.g.: hideDelay*1000*i means delay 1 second to hide the control bar after stop moving mouse. |
keepAspect | Boolean type: "b" | Set whether keep aspect ratio of the video or not when the video is stretched. Default value is true. |
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. |
autoHideMouse | Boolean type: "b" | Set whether hide the mouse cursor automatically or not. Default value is false. |
sndMute | Boolean type: "b" | Specify muting the video or not. Default value is false. |
sndVolume | Integer type: "i" | Set the default value of the sound. Possible values range from 0 to 100. Default value is 100. |
playerAlign |
Character string: "s" |
Set the position of the control bar; top means the control bar shows at the top, bottom (default) means at the bottom. |
showPlayer |
Boolean type: "b" |
Set whether show control bar or not. Default value is true. |
autoLoad | Boolean type: "b" | Set whether load the movie automatically or not. When autoLoad is true, video will be loaded automatically, otherwise, the video won’t be loaded until the play button is clicked. Default value is false. |
unloadOnStop | Boolean type: "b" | Set whether load video or not when video playing is stopped. Default value is false.
When value is false, player will keep loading the remaining video data if the video hasn't been loaded completely before click the stop button. And doesn't need to load the video again when replay it. When value is true, click the Stop button before video data has been loaded completely, the remaining video data won't be loaded and the loaded video data will be eliminated. Player has to load the video again when replay it. |
bufferTime | Floating-point type: "f" | Set the buffer time. Default value is 5.0. e.g.: If value is 2, the player will buffer video data to 2 seconds before playing. |
autoRewind | Boolean type: "b" | Set whether automatically rewind the video or not. Default value is false. |
autoChooseNext | Boolean type: "b" | Set whether play the next video automatically or not. Default value is false.
Note: If the value of autoRewind option is also true, all videos in playlist will be automatically replayed as loop. |
pauseAtFirstFrame | Boolean type: "b" | Specify whether pause at the first frame. Default value is true. If the value is false, the player will automatically play the video. |
pauseAtLastFrame | Boolean type: "b" | Specify whether pause at the last frame. Default value is false. |
bigPlay | Character string: "s" | Set the style of the big play button which will show when the playing is paused or stopped. e.g.: playerOpts=bigPlay*Classic.swf*s, classic is a name of a big player button. Note: This property only will tack effect when the player has no big play button. |
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. |
showReplay |
Boolean type: "b" |
Set whether show Replay button or not. Default value is false. |
textReplay |
Character string: "s" |
Set the character of the Replay button. Default value is "Replay". |
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. |
preLoader | Character string: "s" | Specify the style of the preloader, e.g.: playerOpts= preLoader *Circle2.swf*s, Circle2 is a name of a big player preloader. |
thumbNail | Character string: "s" | Specify the video thumbnail, which will show at the first frame and in the playlist. |
playListPath | Character string: "s" | Specify the video path. |
playItem | Integer type: "i" | Directly specify to play which video in playlist. |
- Tutorials
- Customize a web FLV Player in the easiest way
- Edit the template of player skin
- Play a specific video in a new page
- Customize video banner onto webpage
- Make your custome player skin work in PlayerDIY Web Player
- Edit flash video player with HTML
- Add flash videos onto WordPress
- Add multiple flash video players onto a webpage
- How to Make FLV Player with Flash Professional 8?
- Use multiple playlists with one FLV player?