DOWNLOADS EXAMPLES SKINS DOCS SUPPORT
 
 

Setup - For Pros

1. Download and Unzip

Download the Wimpy JavaScript Kit.

2. Edit wimpy.js

Open the JavaScript file named "wimpy.js" and change the reference to "wimpy.swf" so that it uses a full URL to the Wimpy SWF file within your Wimpy Installation folder.

Example

wimpySwf = "http://www.yoursite.com/mp3s/wimpy.swf";

If you've purchased a license, enter your registration code into the "wimpyReg" variable.

Example

wimpyReg = "MlRRJTI2OCUzRXhGJTI0JTdEMXlrV3VMcVIlNUZ2cHNaS3ElMkYlM0RLNXN3czQlMkU";

If have not yet purchased a license, leave wimpyReg blank, or leave the existing demo registration "as is" until you decide to purchase a license.

4. Page setup

Include wimpy.js
Create a new HTML file and place a reference to the "wimpy.js" file in the <head> of the page.

Example:

<html>
<head>
<title>My Page</title>

<script language='JavaScript' src='http://www.yoursite.com/mp3s/wimpy.js'></script>

</head>

Render the player:

This is required to use any of the JavaScript Controls. In order to take advantage of the JavaScript Controls, an instance of the player must  be established through JavaScript using makeWimpyPlayer.

IMPORTANT NOTE: Only one player can be rendered and controlled on a page. If you need to have more than one player on a page, you may want to consider using Wimpy Rave. Wimpy Rave offeres the ability to render more than on player on a page.

Rendering the player relies on two portions of HTML code:

1. A <div> "target"
2. A JavaScript call

The <div> target

The <div> target is used as a place holder. The JavaScript call replaces the contents of the <div> tag with the player. In the example below, the text "You need to upgrade your Flash Player" will be replaced with the player once the "makeWimpyPlayer" function is called. You may edit text / HTML code within the <div> tag with any other text or HTML code.

The <div> target must be located above the JavaScript call so that JavaScript can replace the HTML code inside the <div> tag (i.e. the <div> tag must exist before the call is made). You can place the <div> anywhere on the page. The player will be rendered where ever the <div> tag is located.

The <div> tag must have the "id" attribute set to "wimpyTarget" (case sensative) as follows:

<div id="wimpyTarget">You need to upgrade your Flash Player</div>

The JavaScript call

The JavaScript call is what is used to actually render the player on the page. The player will not render on the page unless the "makeWimpyPlayer" function is called, and the <div> tag exists somewhere on the page.

NOTE: You may want to place the call to render the player "makeWimpyPlayer" at the bottom of your page so that it is the last "thing" that is done when the page loads.

<script language="JavaScript" >
   makeWimpyPlayer("http://www.yoursite.com/mp3s/example1.mp3");
</script>

NOTE: If you just want to load the player without a start-up track or playlist, you'll have to "trick" Wimpy by referencing an XML file that doesn't exist, or references a playlist that doesn't have any <item>'s in it. If you reference an XML file that doesn't exist (as in this example) you may recieve 404 errors in your server logs, so referencing "real" file that doesn't have any <items> will eliminate server log entries.

<script language="JavaScript" >
   makeWimpyPlayer("blank.xml");
</script>

You can create a unique set of options when establishing the player to over-ride the default settings. To use unique values, create a new "object" and populate it with the settings you want to use. Then set the first argument for "makeWimpyPlayer" to the object name, followed by the width and height for the player.

NOTE: The second and third arguments (width and height) are optional.

NOTE: You only have to include the options within the object that you wish to over-ride. You don't have to include all the available arguments -- just the one that are unique.

<script>

  var MySettings = new Object();
  MySettings.wimpySkin = "skin_bop.xml";
  MySettings.startPlayingOnload = "yes";
  MySettings.startupLogo = "http://www.yoursite.com/path/to/image.jpg";

  makeWimpyPlayer(MySettings);

</script>

For more information on all the available options, see the "Options Reference" page.

4. Basic commands

Control the player:

<a href="JavaScript:;" onClick="wimpy_play()"> Play  </a>
<a href="JavaScript:;" onClick="wimpy_pause()"> Pause </a>

Load a new file into the player:

<a href="JavaScript:;"
onClick="wimpy_addTrack(true, 'example2.mp3', 'Artist', 'Title', 'link.html', 'graphic.jpg');">
Load & play track 1
</a>

The "wimpy_addTrack" consists of 6 arguments:

wimpy_addTrack(
      startOnLoad ,
      theFile ,
      theArtist ,
      theTitle ,
      theLink ,
      theGraphic
};

See the function reference documentation for more information on function calls.

 

 

 

 

 

 

 

  ©Copyright Plaino LLC. All rights reserved.