Resize player windows to correct dimensions on open

This commit is contained in:
Duncan Sommerville 2015-07-02 16:07:49 -04:00
parent 32f0f7fcec
commit e3101e90b2
2 changed files with 59 additions and 57 deletions

View File

@ -1,13 +1,14 @@
var _playlist_jplayer;
var _idToPostionLookUp;
var URL_BAR_HEIGHT = 32;
/**
*When the page loads the ready function will get all the data it can from the hidden span elements
*and call one of three functions depending on weather the window was open to play an audio file,
*or a playlist or a show.
*/
*When the page loads the ready function will get all the data it can from the hidden span elements
*and call one of three functions depending on weather the window was open to play an audio file,
*or a playlist or a show.
*/
$(document).ready(function(){
$.jPlayer.timeFormat.showHour = true;
var audioUri = $('.audioUri').text();
@ -57,7 +58,7 @@ $(document).ready(function(){
$("#jp_container_1").on("mouseenter", "ul.jp-controls li", function(ev) {
$(this).addClass("ui-state-hover");
});
$("#jp_container_1").on("mouseleave", "ul.jp-controls li", function(ev) {
$(this).removeClass("ui-state-hover");
});
@ -65,14 +66,14 @@ $(document).ready(function(){
});
/**
* Sets up the jPlayerPlaylist to play.
* - Get the playlist info based on the playlistID give.
* - Update the playlistIndex to the position in the pllist to start playing.
* - Select the element played from and start playing. If playlist is null then start at index 0.
* Sets up the jPlayerPlaylist to play.
* - Get the playlist info based on the playlistID give.
* - Update the playlistIndex to the position in the pllist to start playing.
* - Select the element played from and start playing. If playlist is null then start at index 0.
**/
function playAllPlaylist(p_playlistID, p_playlistIndex) {
var viewsPlaylistID = $('.playlistID').text();
if ( _idToPostionLookUp !== undefined && viewsPlaylistID == p_playlistID ) {
play(p_playlistIndex);
}else {
@ -83,7 +84,7 @@ function playAllPlaylist(p_playlistID, p_playlistIndex) {
function playBlock(p_blockId, p_blockIndex)
{
var viewsBlockId = $('.blockId').text();
if ( _idToPostionLookUp !== undefined && viewsBlockId == p_blockId ) {
play(p_blockIndex);
} else {
@ -92,15 +93,15 @@ function playBlock(p_blockId, p_blockIndex)
}
/**
* Sets up the show to play.
* checks with the show id given to the show id on the page/view
* if the show id and the page or views show id are the same it means the user clicked another
* file in the same show, so don't refresh the show content tust play the track from the preloaded show.
* if the the ids are different they we'll need to get the show's context so create the uri
* and call the controller.
* Sets up the show to play.
* checks with the show id given to the show id on the page/view
* if the show id and the page or views show id are the same it means the user clicked another
* file in the same show, so don't refresh the show content tust play the track from the preloaded show.
* if the the ids are different they we'll need to get the show's context so create the uri
* and call the controller.
**/
function playAllShow(p_showID, p_index) {
var viewsShowID = $('.showID').text();
if ( _idToPostionLookUp !== undefined && viewsShowID == p_showID ) {
play(p_index);
@ -110,12 +111,12 @@ function playAllShow(p_showID, p_index) {
}
/**
* This function will call the AudiopreviewController to get the contents of
* either a show or playlist Looping throught the returned contents and
* creating media for each track.
*
* Then trigger the jplayer to play the list.
*/
* This function will call the AudiopreviewController to get the contents of
* either a show or playlist Looping throught the returned contents and
* creating media for each track.
*
* Then trigger the jplayer to play the list.
*/
function buildplaylist(p_url, p_playIndex) {
_idToPostionLookUp = Array();
$.getJSON(p_url, function(data){ // get the JSON array produced by my PHP
@ -126,7 +127,7 @@ function buildplaylist(p_url, p_playIndex) {
var skipped = 0;
for(index in data) {
if (data[index]['type'] == 0) {
if (data[index]['type'] == 0) {
if (data[index]['element_mp3'] != undefined){
media = {title: data[index]['element_title'],
artist: data[index]['element_artist'],
@ -152,7 +153,7 @@ function buildplaylist(p_url, p_playIndex) {
console.log("continue");
skipped++;
continue;
}
}
} else if (data[index]['type'] == 1) {
var mime = data[index]['mime'];
if (mime.search(/mp3/i) > 0 || mime.search(/mpeg/i) > 0) {
@ -163,12 +164,12 @@ function buildplaylist(p_url, p_playIndex) {
key = "m4a";
} else if (mime.search(/wav/i) > 0) {
key = "wav";
}
}
if (key) {
media = {title: data[index]['element_title'],
artist: data[index]['element_artist']
};
};
media[key] = data[index]['uri']
}
}
@ -186,26 +187,19 @@ function buildplaylist(p_url, p_playIndex) {
_playlist_jplayer.setPlaylist(myPlaylist);
_playlist_jplayer.option("autoPlay", true);
play(p_playIndex);
var height = Math.min(143 + (26 * total), 400);
var width = 505;
if (height === 400) {
window.scrollbars = true;
}
else {
//there's no scrollbars so we don't need the window to be as wide.
width = 490;
}
window.resizeTo(width, height);
window.scrollbars = false;
var container = $("#jp_container_1");
// Add 2px to account for borders
window.resizeTo(container.width() + 2, container.height() + URL_BAR_HEIGHT + 2);
});
}
/**
*Function simply plays the given index, for playlists index can be different so need to look up the
*right index.
*/
*Function simply plays the given index, for playlists index can be different so need to look up the
*right index.
*/
function play(p_playlistIndex){
playlistIndex = _idToPostionLookUp[p_playlistIndex];
if(playlistIndex == undefined){
@ -216,13 +210,13 @@ function play(p_playlistIndex){
}
/**
* Playing one audio track occurs from the library. This function will create the media, setup
* jplayer and play the track.
*/
* Playing one audio track occurs from the library. This function will create the media, setup
* jplayer and play the track.
*/
function playOne(uri, mime) {
var playlist = new Array();
var media = null;
var media = null;
var key = null;
if (mime.search(/mp3/i) > 0 || mime.search(/mpeg/i) > 0) {
key = "mp3";
@ -232,12 +226,12 @@ function playOne(uri, mime) {
key = "m4a";
} else if (mime.search(/wav/i) > 0) {
key = "wav";
}
}
if (key) {
media = {title: $('.audioFileTitle').text() != 'null' ?$('.audioFileTitle').text():"",
artist: $('.audioFileArtist').text() != 'null' ?$('.audioFileArtist').text():""
};
};
media[key] = uri;
}
@ -247,4 +241,8 @@ function playOne(uri, mime) {
_playlist_jplayer.setPlaylist(playlist);
_playlist_jplayer.play(0);
}
var container = $("#jp_container_1");
// Add 2px to account for borders
window.resizeTo(container.width() + 2, container.height() + URL_BAR_HEIGHT + 2);
}

View File

@ -1,3 +1,6 @@
var previewWidth = 482,
previewHeight = 110;
$(document).ready(function() {
/* Removed as this is now (hopefully) unnecessary */
@ -95,7 +98,7 @@ function open_audio_preview(type, id) {
// The reason that we need to encode artist and title string is that
// sometime they contain '/' or '\' and apache reject %2f or %5f
// so the work around is to encode it twice.
openPreviewWindow(baseUrl+'audiopreview/audio-preview/audioFileID/'+id+'/type/'+type);
openPreviewWindow(baseUrl+'audiopreview/audio-preview/audioFileID/'+id+'/type/'+type, previewWidth, previewHeight);
_preview_window.focus();
}
@ -113,7 +116,7 @@ function open_playlist_preview(p_playlistID, p_playlistIndex) {
if (_preview_window != null && !_preview_window.closed)
_preview_window.playAllPlaylist(p_playlistID, p_playlistIndex);
else
openPreviewWindow(baseUrl+'audiopreview/playlist-preview/playlistIndex/'+p_playlistIndex+'/playlistID/'+p_playlistID);
openPreviewWindow(baseUrl+'audiopreview/playlist-preview/playlistIndex/'+p_playlistIndex+'/playlistID/'+p_playlistID, previewWidth, previewHeight);
_preview_window.focus();
}
@ -124,7 +127,7 @@ function open_block_preview(p_blockId, p_blockIndex) {
if (_preview_window != null && !_preview_window.closed)
_preview_window.playBlock(p_blockId, p_blockIndex);
else
openPreviewWindow(baseUrl+'audiopreview/block-preview/blockIndex/'+p_blockIndex+'/blockId/'+p_blockId);
openPreviewWindow(baseUrl+'audiopreview/block-preview/blockIndex/'+p_blockIndex+'/blockId/'+p_blockId, previewWidth, previewHeight);
_preview_window.focus();
}
@ -138,13 +141,14 @@ function open_show_preview(p_showID, p_showIndex) {
if (_preview_window != null && !_preview_window.closed)
_preview_window.playAllShow(p_showID, p_showIndex);
else
openPreviewWindow(baseUrl+'audiopreview/show-preview/showID/'+p_showID+'/showIndex/'+p_showIndex);
openPreviewWindow(baseUrl+'audiopreview/show-preview/showID/'+p_showID+'/showIndex/'+p_showIndex, previewWidth, previewHeight);
_preview_window.focus();
}
function openPreviewWindow(url) {
function openPreviewWindow(url, w, h) {
var dim = (w && h) ? 'width=' + w + ',height=' + h + ',' : '';
// Hardcoding this here is kinda gross, but the alternatives aren't much better...
_preview_window = window.open(url, $.i18n._('Audio Player'), 'width=482,height=110,scrollbars=yes');
_preview_window = window.open(url, $.i18n._('Audio Player'), dim + 'scrollbars=yes');
return false;
}