Make Flash Animations, Video, Slideshows, Text Effects, Buttons & Menus. Designer Templates, 250 Effects, plus Components & Video Controls

简体中文 繁體中文 Français Español Italiano 日本 Polski Deutsch SWiSHzone.com
SWiSHzone.com Banner
You are here: Home > Community > Tutorials
Community
FREE TOOLS!
Laboratory
Community Overview
Movies
Components
Effects
Screencast Tutorials
> Tutorials
Official Blog
Forums
Other Forums
Request help
Search Tutorials

 All words
 Any words

 Similar words
 Exact words

Number of Results:
Monthly Newsletter
Get our monthly newsletter for all the latest news
competitions, tutorials and tips > Sign Up Now

SWiSH Jukebox: Jukebox Files and Paths
Creator: Brian Ayers
Website: http://www.swishzone.com
Submitted: Mon May 08 2006
Description: By default, it is necessary to upload all files published through SWiSH Jukebox (audio track .SWF or .FLV files, the Player .SWF file, and the playlist.xml file) to the same folder as your container .HTML page. With recent changes to the controls, you can now put those files anywhere you want (with a little modification to your HTML and XML files). This tutorial will explain the process allowing you to create your own file structures, add multiple players to a single page (all using different playlists), and add a Jukebox to your MySpace profiles.
Zip File: Download


Program: SWiSH Jukebox
Build Date: 2006.05.04+

 

Important

In order for some of the features in this tutorial to work properly, you need to ensure that you have the latest release build of SWiSH Jukebox installed (build date 2006.05.04 or later). You can check the build date in SWiSH Jukebox through Help Menu -> About SWiSH Jukebox -> build date.

Introduction

By default, it is necessary to upload all files published through SWiSH Jukebox (audio track .SWF or .FLV files, the Player .SWF file, and the playlist.xml file) to the same folder as your container .HTML page. With recent changes to the controls, you can now put those files anywhere you want (with a little modification to your HTML and XML files). This tutorial will explain the process allowing you to create your own file structures, add multiple players to a single page (all using different playlists), and add a Jukebox to your MySpace profiles.

Relative vs. Absolute URLs

In order to take full advantage of these new features, you will need to have a basic understanding of how Relative URLs work. Click the link below for an excellent reference page explaining the proper notation for Relative URLs:
http://www.webreference.com/html/tutorial2/3.html

If you are unfamiliar or uncomfortable with Relative URLs, or if you simply require a full URL path (MySpace profiles are one example of this), then you can always use Absolute URLs instead. The link above is a perfect example of an Absolute URL (which includes the full http:// path leading directly to the file or page of your choice).

For the purpose of simplicity, I would recommend taking the safest course of action and use an Absolute URL (at least for the features explained in this tutorial); however, if you're perfectly comfortable with Relative URLs and understand the slight oddities within the Flash player (SWF vs FLV paths), then feel free to use them.

Step One - Editing the XML Playlist

If you want to upload your audio tracks (.SWF or .FLV) to a folder other than the one that holds your .HTML page, you will need to edit the path to those tracks within the playlist.xml file. You can open this file in Windows Notepad (probably the easiest and fastest way).

In the Playlist XML file, you will see information similar to this:

<?xml version="1.0" encoding="UTF-8"?>
<PLAYERSETTINGS autostart="no" playall="yes" loop="no" shuffle="no"/>
<PLAYLIST>
  <FILE src="ba_Synthetic_Funk.swf" desc="Synthetic Funk" artist="Brian Ayers" album="Swish-Tutorials.com" minutes="0" seconds="41"/>
  <FILE src="ba_fourth_date.swf" desc="Fourth Date" artist="Brian Ayers" album="Swish-Tutorials.com" minutes="1" seconds="1"/>
</PLAYLIST>

You will need to edit the "src" information for each FILE and point it to the correct location on your web server.

For example:

<?xml version="1.0" encoding="UTF-8"?>
<PLAYERSETTINGS autostart="no" playall="yes" loop="no" shuffle="no"/>
<PLAYLIST>
  <FILE src="http://www.yoursite.com/audio/ba_Synthetic_Funk.swf" desc="Synthetic Funk" artist="Brian Ayers" album="Swish-Tutorials.com" minutes="0" seconds="41"/>
  <FILE src="http://www.yoursite.com/audio/ba_fourth_date.swf" desc="Fourth Date" artist="Brian Ayers" album="Swish-Tutorials.com" minutes="1" seconds="1"/>
</PLAYLIST>

Save the changes once you have modified the SRC paths.

Step Two - Editing the HTML Code

The previous step was already possible in SWiSH Jukebox, but recent changes now allow you to put the actual playlist.xml file anywhere you want. In order to accomplish this, you will need to edit the <object> and <embed> code within the HTML file (that holds either your own movie - or the audio Player .SWF file).

You can send a variable to the .SWF file that contains the path to your playlist.xml file. This is done through the use of FlashVars. Open your HTML source file (again, you can use Windows Notepad for this, or any other HTML/WYSIWYG editor). Find the <OBJECT> and <EMBED> tags in the HTML code (the example below was taken from Dreamweaver).

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="170" height="75">
  <param name="movie" value="Player010.swf" />
  <param name="quality" value="high" />
  <embed src="Player010.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="170" height="75"></embed>
</object>

PLEASE NOTE: The FlashVars parameter needs to be added within both the <OBJECT> tag and the <EMBED> tag. You can use the example below as a template. It is VERY important that you give the correct name to the variable. The Jukebox player looks for the variable pl1 (as in "pee-el-one", which, obviously stands for "playlist1"). The value of this variable will be used to load the playlist.xml file from any path you specify. If you give the variable any other name (or don't add FlashVars at all) it will load "playlist.xml" using a Relative URL (relative to the HTML page).

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="170" height="75">
<param name="movie" value="Player010.swf" />
<param name="quality" value="high" />
<param name="FlashVars" value="pl1=http://www.yoursite.com/playlists/playlist.xml"
<embed src="Player010.swf" FlashVars="pl1=http://www.yoursite.com/playlists/playlist.xml" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="170" height="75"></embed>
</object>

Using this method, you can even rename the playlist.xml file. You could have a separate playlist displayed in different players, just be passing the FlashVars within the HTML code.

Adding Jukebox to your MySpace Profile

A basic tutorial for adding SWiSHmax movies to your MySpace profile has already been written. You can view it HERE

To add your Jukebox players to your profile, jump to Step 4 in that tutorial. When you get to the point where you need to paste your HTML code, use the templates I've included above. You will need to copy the code from <embed> to </embed> (after you've added the FlashVars information). When you paste it into MySpace, it should look something like this:

NOTE: You ALSO need to edit the <embed src="" information to point to the actual Player .SWF file (again, since you can't upload directly to MySpace).

So, now the world can enjoy your music right along with you!

Enjoy!

 

 

 



Search | Privacy policy | Contact us | Site Map | Copyright SWiSHzone.com Pty Ltd 1999-2010