Example 7
This example shows you how to pop up a window, then control the player from the page that opened the window (this page).
First click one of these links to open a window:
Next, use the following links to control the player.
- Load and Play: track 1
- Load and Play: track 2
- Load and Play: track 3
- Remove first item from playlist.
- Clear Playlist
- Add Track, but don't play
- Add Playlist to Playlist
- Load and open and external XML playlist
- Next
- Previous
- Play
- Pause
- Stop
- Go to and play the second track in the playlist
Source Code See the "NOTES" section below for additional information about this example.
<script language="JavaScript" >
// NOTE: These functions are used to pop up the player window
var wimpyWindow;
var winOpen=0;
function wimpyPopPlayer(wimpyPopPage,theWidth,theHeight) {
wimpyWindow = window.open(wimpyPopPage,'wimpyMP3player','width='+theWidth+',height='+theHeight);
winOpen=1;
}
function wimpyPopPlayerWithFile(wimpyPopPage,initialFile,theWidth,theHeight) {
wimpyWindow = window.open(wimpyPopPage+'?theFile='+initialFile,'wimpyMP3player','width='+theWidth+',height='+theHeight);
winOpen=1;
}
function wimpyIsOpen(){
if (winOpen==1){
if (wimpyWindow.closed){
return false;
} else {
return true;
}
} else {
return false;
}
}
function wimpyPopAndPlay(startOnLoad, theFile, theArtist, theTitle, graphicURL, hotlinkURL){
if(wimpyIsOpen()){
wimpyWindow.wimpy_addTrack(startOnLoad, theFile, theArtist, theTitle, graphicURL, hotlinkURL);
} else {
wimpyPopPlayerWithFile('wimpy_js_example7-popup.html',theFile,'480','140');
}
}
</script>
These links are used to communicate and control the player in the popped up window.
<a href="javascript:;" onclick="wimpyPopAndPlay(true, 'example1.mp3', '', 'Track 1', '', '');">
- Load and Play: track 1
</a>
<a href="javascript:;" onclick="wimpyPopAndPlay(true, 'example2.mp3', '', 'Track 2', '', '');">
- Load and Play: track 2
</a>
<a href="javascript:;" onclick="wimpyPopAndPlay(true, 'example3.mp3', '', 'Track 3', '', '');">
- Load and Play: track 3
</a>
<a href="javascript:;" onclick="wimpyWindow.wimpy_clearPlaylist();">
- Clear Playlist
</a>
<a href="javascript:;" onclick="wimpyPopAndPlay(false, 'example4.mp3', 'My Artist', 'My Title', 'http://www.wimpyplayer.com', 'image.jpg');">
- Add Track, but don't play
</a>
<a href="javascript:;" onclick="wimpyPopAndPlay(false, 'playlist1.xml', '', 'Band\'s Title', 'http://www.wimpyplayer.com', 'image.jpg');">
- Add Playlist to Playlist
</a>
<a href="javascript:;" onclick="wimpyWindow.wimpy_loadExternalPlaylist('playlist1.xml');">
- Load and open and external XML playlist
</a>
<a href="javascript:;" onclick="wimpyWindow.wimpy_next();">
- Next
</a>
<a href="javascript:;" onclick="wimpyWindow.wimpy_prev();">
- Previous
</a>
<a href="javascript:;" onclick="wimpyWindow.wimpy_play();">
- Play
</a>
<a href="javascript:;" onclick="wimpyWindow.wimpy_pause();">
- Pause
</a>
<a href="javascript:;" onclick="wimpyWindow.wimpy_stop();">
- Stop
</a>
<a href="javascript:;" onclick="wimpyWindow.wimpy_gotoTrack(2);">
- Go to and play the second track in the playlist
</a>
1. Altered function calls
The JavaScript function "calls" on this page differ slightly from the calls made on the other examples.
The difference being that "wimpyWindow" is used in front of each function call. "wimpyWindow" should not be confused with window naming conventions. "wimpyWindow" references an "Object" -- NOT a window name.
To illustrate, other examples reference functions as:
wimpy_stop()This page references functions as:
wimpyWindow.wimpy_stop()
2. Additional functions.
Javascript function included in the source of this page.
wimpyPopPlayer
Will pop up Wimpy and use the "default" playlist that is defined in the page that is popped up. For this example, wimpy_js_example7-popup.html has "playlist1.xml" already defined as the default playlist. if wimpyPopPlayerWithFile is used, the default playlist will be ignored.wimpyPopPlayerWithFile
Will open Wimpy in a pop up window and populate the Wimpy playlist with an MP3 file, or if you use a reference to an XML playlist, the contents of the XML playlist will be populated in Wimpy. With this function, the reference to either the MP3 file or XML playlist go into the second parameter.wimpyPopAndPlay
This is a modification / extension of wimpy_LoadAndPlay(), which includes extra funcitonality to check to ensure that the window is available before issueing the request.NOTE: When wimpyPopAndPlay and wimpyPopPlayerWithFile functions are used, Artist, Track, Image and Link attributes will not be available within the player. Only when a window is available will you be able to include Artist, Title, Image and Link data to the player.
Javascript funcitons added on the popped up page (wimpy_js_example7-popup.html).
This example is to be used in conjunction with readme_wimpy_js_example7-popup.html, which includes additional JavaScript functions.. Be sure to review the JavaScript within the source code of that page.
3. No "is window open" check for other commands.
This example does not include any kind of check to see if the pop up window is still available for the standard control funcitons included in wimpy.js.
In other words, if the user closes the pop up window and then clicks one of the commands (such as "Play"), there is no JavaScript included to re-open the window and carry out the command.