When the video is converted you get the file settings.xml and the following HTML code:
<head>
<script type="text/javascript" src="swfobject/swfobject.js"</script>
<script type="text/javascript">
var stageW = 550;
var stageH = 306;
var cacheBuster = Date.parse(new Date());
var flashvars = {};
var params = {};
params.bgcolor = "#ffffff";
params.allowfullscreen = "true";
flashvars.stageW = stageW;
flashvars.stageH = stageH;
flashvars.pathToFiles = "player/";
flashvars.settingsPath = "xml/settings.xml";
flashvars.xmlPath = "xml/mp3_player.xml";
flashvars.keepSelected = "t";
flashvars.selectedWindow = "4";
flashvars.slideshow = "t";
flashvars.imageWidth = "140";
flashvars.imageHeight = "200";
swfobject.embedSWF("preview.swf?t=" + cacheBuster, "audioPlayer", stageW, stageH,
"9.0.124", "js/expressInstall.swf", flashvars, params);
</script>
</head>
<body>
<div id="audioPlayer">
<p>
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"
alt="Get Adobe Flash player" />
</a>
</p>
</div>
</body>
Options set in xml file - The XML file has three sections:
- 1. Options
- autoResize - if this option is set to true then the player will be displayed on the whole stage
- width and height - use these options if you want not to use the whole stage (these options will be ignored if autoResize=true)
- buttons space - set the distance between the buttons on the controls bar (pixels)
- buttons display - set the order in which you want the buttons to appear in controls bar
- button sound - if this option is set to true, a faint sound will be heard when clicking a button
- showMiddlePlayBtn - if this option is set to true then Middle Play Button will be displayed when the video is stopped or paused
- controls bar hide - if this option is set to true, the controls bar will auto-hide if during a given time in seconds there is no user activity
- controls bar hideDelay - the time in seconds since the last user activity, after which the control bar autohides
- videos buffer - the time in seconds needed to be pre-downloaded before the video starts to play
- keepAspectRatio - if this option is set to false then the video will be shown on the entire player area
- autoLoad - if this option is set to true than the player will start loading the video at startup
- autoPlay - if this option is set to true then the player will start playing the video at startup (it will ignore autoLoad option)
- umpToNextCategory - if this option is set to true, and playContinuously is also set to true, the player will move to the first video in the next category after the last video in the current category is finished
- loop - if this option is set to true then the player will replay the video
- random - if this option is set to true then the player will randomly play a new video when the current one reached the end, and if autoPlay is set to true.
- volume default - the default volume
- volume format - the volume bar can be set to be either vertical or horizontal
- watermark visible - if this option is set to true then a Watermark image will be displayed over the video
- watermark position - the value can be TL, TR, BL, BR (T-top, B-bottom, R-Right, L-Left)
- tooltip visible - if this option is set to true, auto-resizeable tooltips will appear to hint the user on each button's function
- tooltip hideDelay - the time in seconds before the tooltip autohides, after the mose pointer has moved away from the button
- listeners spaceKey - if this option is set to true then when the space key is pressed the video will toggle play-pause events
- listeners click - if this option is set to true then when the background area is clicked the video will toggle play-pause events
- listeners doubleClick - if this option is set to true, double clicking inside the player area will switch in and out of full screen mode
- cursor hide - if this option is set to true, the mouse pointer will auto-hide if during a given time in seconds there is no user activity
- cursor hideDelay - the time in seconds since the last user activity, after which the mouse pointer autohides
- playlist size - the playlist's height (for top/bottom alignment) or its width (for left/right alignment), measured in pixels
- playlist thumbWidth - the width of the thumb images inside the playlist; measured in pixels
- playlist thumbHeight - the height of the thumb images inside the playlist; measured in pixels
- playlist thumbPadding - the distance between the playlist's thumbs, measured in pixels
- description visible - if this option is set to true, the video's description will be shown at the bottom of the player
- description size - the height, in pixels, of the description area
mp3_player.xml structure:
This xml contains the mp3 player data. It has a number of album nodes like
the next one:
Every album node has three attributes: album name, author name and
album image.
<album name="Paper Trail" author="TI" imageUrl="images/TI/image.jpg">
Also, every album node contains a number of sub nodes, which represent
the songs of the album.
The song node value corresponds to an mp3 file and has four attributes:
name of the song, duration of the song, buy or download buttons and
download source of the song.
<song name="56 Bars (Intro)" duration="0 : 34" buy="false"
download="true"
downloadSource="download/song1.mp3">songs/song3.mp3</song>
If the buy attribute is set to true it means that the user can buy the song. If it
is set to false then we go further to the download attribute, and the buy
button won’t be visible.
If download is set to true it means that the song is free and you can
download it by clicking on the download button. If it is set to false, it means
that the song is not available for download either, so none of these two
buttons will be visible.
