// jquery to embed any number of FlowPlayer instances in page and reset all other players when given player is clicked or has its video changed via dropdown

// created by Mike Mulholland, Imageine Web Design (mike@imageinewebdesign.com)

// version 1.0 October 24, 2008

(	
	function($)
	{		
		$.fn.extend
		(
			{
				flowembed: function(pickerClass, captionClass)
				{ 			
					var playerDivs = this;
					if (!haveFlash)
					{
						$("div.noFlashText").css("display", "block");
					}
					else
					{
						$("div.playButton").css("display", "block");
						return playerDivs.each
						(
							function(thisPlayerIndex,thisPlayerDiv)
							{
								var	captionHeight = 0;
								var videoCount = $("select." + pickerClass)[thisPlayerIndex].length;
								for (var i=videoCount-1; i>=0; i--) //do in decreasing order so don't have to change back to first one when done
								{
									$($("div." + captionClass)[thisPlayerIndex]).html(videoCaptions[thisPlayerIndex][i]);
									captionHeight = Math.max(captionHeight, $($("div." + captionClass)[thisPlayerIndex]).height());
								}
								$($("div." + captionClass)[thisPlayerIndex]).height(captionHeight);
								$("select." + pickerClass)[thisPlayerIndex].selectedIndex = 0; //set corresponding select to first option - explicit requirement due to sticky select; "selectedIndex" is JavaScript, not JQuery, and thus works on DOM object, not JQuery object
								$($("select." + pickerClass)[thisPlayerIndex]).change //requires JQuery object
								(
									function()
									{
										$(thisPlayerDiv).trigger("click");
									}
								);
								$(thisPlayerDiv).data("HTML",$(thisPlayerDiv).html()); //store inner HTML of div for restoring back to what it was prior to embedding video player when different video player is to have flowplayer embedded and played - this HTML will be the same for all players unless splash initial images are used
								$(thisPlayerDiv).click
								(
									function(event)
									{
										if ($("select." + pickerClass)[thisPlayerIndex].length == 0) //container is empty
										{
											return false;  //don't do anything
										}
										playerDivs.each //loop over all playerDivs
										(
											function(anyPlayerIndex, anyPlayerDiv)
											{
												if (anyPlayerIndex == thisPlayerIndex) //this div contains clicked button
												{
													var optionIndex = $("select." + pickerClass)[thisPlayerIndex].selectedIndex;
													currentVideoUsedIds[thisPlayerIndex] = videoUsedIds[thisPlayerIndex][optionIndex]; //for edit
													$($("div." + captionClass)[thisPlayerIndex]).html(videoCaptions[thisPlayerIndex][optionIndex]);
													playerConfig.videoFile = vidFolder + videoFiles[thisPlayerIndex][optionIndex];
													playerConfig.showVolumeSlider = playerConfig.showMuteVolumeButton = videoHasAudio[thisPlayerIndex][optionIndex];
													flashembed(thisPlayerDiv, playerParams, {config: playerConfig}); //flashembed is javascript, not JQuery, so must use DOM object "thisPlayerDiv" rather than JQuery object "$(thisPlayerDiv)" here
												}
												else //this div does not contain clicked button
												{
													$(anyPlayerDiv).html($(anyPlayerDiv).data("HTML")); //restore to state prior to embedding video player
												}
											}
										);
									}
								);
							}
						);
					}
				}
			}
		);
	}
) (jQuery);