Themes

Themes

One cool feature of Simple JQuery Media Player is it's support for themes located in the templates folder
Simple JQuery Media Player, being based on the smarty template engine is designed with customization and eye candy in mind if you want to make a theme I suggest you familliarise yourelf with smarty first but if you are already familliar with smarty here are some important smarty variables

{{$width}}

width of the player most likely to be used in css calculations.

{{$height}}

height of the player most likely to be used in css calculations.

{{$playlist}}

the playlist ini data to be passed to the javascript

{{$mediadir}}

media dir of current playlist

{{$artdir}}

art dir of current playlist

you will also need to know javascript but since all you will be doing for themes is assigning variables so that should be a piece of cake define these variables before you include the common.js which contains all the functions for controling the mediaplayer.

var playlist = INI('{{$playlist}}');

required for the mediaplayer to interpret your playlist

var mediadir = "{{$mediadir}}";

reqired for inclusion of media

var artdir = "{{$artdir}}";

required for inclusion of art

var progresstype = <"block"|"bevel">;

reqired for type of progressbar

var blockwidth=<width in pixels>;

reqired for width of each progressbar block

and here are some ids and classes for widgets like buttons and important parts of the player

Classes

bevel

the main box of the media player

insetbevel

the art and video container of the media player

progressbarout

the outside box of the progressbar

progressbarin

the progressbar itself

button

the common class for a button

Ids

audio

the audio element

audiofile

the source of the audio element

video

the video element

videofile

the source of the video element

buttons

back

rw

playbutton

pausebutton

ff

next

stopbutton

volup

voldown

loopon

loopoff