Dynamic Music Player (Music Players)

Dynamic music player:

Description:

A Dynamic music player with 3 different ways in which it can be used. It is customizable via an XML file making its usage fairly scalable according to the user’s wishes.

The 3 different ways the player can be used

Dynamic music player uages

Within another Flash document:

  • The music player is self contained and has some public methods that allow the user to control the player.
  • A public method called ‘removePlayer’ allows the user to remove the player from the display list and clears the variables. This essentially removes it from memory which increases performance of the user’s Flash document when the player is no longer required. An example of its usage could be a change in navigation. IE Navigating away from the music player page
  • The player can be created by either dragging and dropping it on the stage from the library or creating it using Actionscript, both methods are detailed in the help documentation
  • All the library elements for the dynamic music player are stored in a folder and adequately labelled so any user wishing to make some cosmetic changes to the movieclips shouldn’t have any trouble doing so. Please remember that any changes made to the dynamic music player are done at your own risk.

In an HTML document

  • A user that doesn’t want to dabble with the interior workings of the dynamic music player can customize the player using FlashVars in an HTML file and the XML file. This is all thanks to SWFObject which allows for variable assignment outside of Flash which provides a variable reference to the XML file containing all the information required by the music player
  • HTML developers can swap the XML document which controls the colouration and music loaded by the dynamic music player by editing the FlashVars line within the HTML file. An example of this is detailed in the help documentation

WordPress plug-in

  • The dynamic music player as has to the internet’s top blog based platform, WordPress. The dynamic music player can be added to posts and to the sidebar.
  • The plug-in installation is exactly the same as any WordPress plug-in. Details for installing the plug-in are provided in the help documentation.
  • Once the plug-in is installed, the user only needs to add a shortcode to the post, page, sidebar or footer indicating which XML file to target for the dynamic music player settings, width and the height of the player.

Unlimited Colour variations:

The customization values in the XML allow for colour changes that provides an unlimited amount of colour variations for the dynamic music player.

Unlimited colour variations

Basic XML setup:

The whole player is controlled from one XML document. This document has the following modifiable properties, most of which have easy to understand names. More details on each one of the values is available in the help documentation.

  • mainInterfaceColour
  • highInterfaceColour
  • playListItemColour
  • visualizerInterfaceColour
  • bottomBarColour
  • mainButtonColour
  • highButtonColour
  • progressBarColour
  • loadBarColour
  • songFontColour
  • timeFontColour
  • scrollButtonColour
  • scrollBarColour
  • visualizerColour1
  • visualizerColour2
  • visualizerColour3
  • visualizerColour4
  • visualizerColour5
  • visualizerColour6
  • hidePlayList
  • initialVolume
  • autoPlay
  • shuffleSongs
  • repeat
  • useGradient
  • itemSpace
  • mouseWheelSense
  • songShift
  • hideVisualizer
  • hideBottomMc
  • tinyVersion
  • playListHeight
  • playerWidth

Adding audio files into the XML

Adding items into the XML document has a straight forward approach. There are only 3 requirements for each song. These requirements are as follows:

  • Artist name
  • Track name
  • Track link

Sage Francis
The best of times
assets/1.mp3

The player has a variable height and width option

Two values within the XML allow the user to control how many items the playlist should display which increases the height of the player. Another option allows users to manipulate the width of the player. Information on how to setup the player with variable height and with is detailed in the help documentation

We created a calculator that helps you determine the height and width of the player and makes it a lot easier when setting it up.
Two values within the XML allow the user to control how many items the playlist should display which increases the height of the player. Another option allows users to manipulate the width of the player. Information on how to setup the player with variable height and with is detailed in the help documentation

Customize the player by removing unwanted elements available:

Using the XML settings a user is able to have a minimized version of the dynamic music player. The different minimized versions of the music player are as follows:

  • Regular version with all elements
  • No Playlist
  • No Playlist and Visualizer
  • No Playlist, Visualizer and Bottom bar
  • No Playlist and Bottom bar
  • No Bottom bar
  • Tiny versions with and without visualizer

Tiny format with or without visualizer

Dynamic video player also has a mini format which reduces its size to just 2 buttons: Play/Pause and Stop. The compact version is ideal for top corner or bottom corner positioning on a web page.
Using the XML settings a user is able to have a minimized version of the dynamic music player. The different minimized versions of the music player are as follows:

Examples provided for each of the 3 methods of use

The downloaded files contain examples as well as descriptions of each example making it easier for a user to work with the music player.

Online WordPress sample

View a live example of the music player which exists on a post within a WordPress blog

View the Help documentation

A lot of people seem interested in viewing the help documentation before purchasing the component and for that reason a link to the Help PDF is provided to give users an idea of its contents.

Download Dynamic Music Player (Music Players)

Leave a Reply

Your email address will not be published. Required fields are marked *