/*!
* jquery.yoxview
* jQuery image gallery viewer
* http://yoxigen.com/yoxview
*
* Copyright (c) 2010 Yossi Kolesnicov
*
* Licensed under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*
* Date: 13th November, 2010
* Version : 2.2
*/
(function($) {
if (!$.yoxview)
$.yoxview = new YoxView();
$.fn.yoxview = function(options) {
if (this.length != 0) {
if ($.yoxview[options])
return $.yoxview[options].apply(this, Array.prototype.slice.call(arguments, 1));
else if (typeof options === 'object' || !options)
$.yoxview.init(this, options);
else
$.error('Method ' + options + ' does not exist on YoxView.');
}
return this;
};
$(Yox.getTopWindow()).unload(function() {
if ($.yoxview) {
$.yoxview.unload();
delete $.yoxview;
}
});
function YoxView() {
var yoxviewPath = (yoxviewPath || Yox.getPath(/(.*\/)jquery\.yoxview/i));
var defaults = {
autoHideInfo: true, // If false, the info bar (with image count and title) is always displayed.
autoPlay: false, // If true, slideshow mode starts when the popup opens
backgroundColor: "#000000",
backgroundOpacity: 0.8,
buttonsFadeTime: 300, // The time, in milliseconds, it takes the buttons to fade in/out when hovered on. Set to 0 to force the Prev/Next buttons to remain visible.
cacheBuffer: 5, // The number of images to cache after the current image (directional, depends on the current viewing direction)
cacheImagesInBackground: true, // If true, full-size images are cached even while the gallery hasn't been opened yet.
controlsInitialFadeTime: 1500, // The time, in milliseconds, it takes the menu and prev/next buttons to fade in and out when the popup is opened.
controlsInitialDisplayTime: 1000, // The time, in milliseconds, to display the menu and prev/next buttons when the popup is opened. Set to 0 to not display them by default
dataFolder: yoxviewPath + "data/",
defaultDimensions: { // Default sizes for different types of media, in case none was specified
flash: { width: 720, height: 560 },
iframe: { width: 1024 }
},
flashVideoPlayer: "jwplayer", // The default player for Flash video files
imagesFolder: yoxviewPath + "images/",
infoBackColor: "#000000",
infoBackOpacity: 0.5,
isRTL: false, // Switch direction. For RTL languages such as Hebrew or Arabic, for example.
lang: "en", // The language for texts. The relevant language file should exist in the lang folder.
langFolder: yoxviewPath + "lang/",
loopPlay: true, // If true, slideshow play starts over after the last image
playDelay: 3000, // Time in milliseconds to display each image
popupMargin: 20, // the minimum margin between the popup and the window
popupResizeTime: 600, // The time in milliseconds it takes to make the resize transition from one image to the next.
renderButtons: false, // Set to false if you want to implement your own Next/Prev buttons, using the API.
renderMenu: true, // Set to false if you want to implement you own menu (Play/Help/Close).
showBarsOnOpen: true, // If true, displays the top (help) bar and bottom (info) bar momentarily when the popup opens.
showButtonsOnOpen: false, // If true, displays the Prev/Next buttons momentarily when the popup opens.
showDescription: false, // Set to false to not show the description text (the title will still show).
textLinksSelector: ".yoxviewLink", // A jQuery selector to identify links that are not thumbnails, which YoxView should try to open.
thumbnailsOptions: { thumbnailsClass: "yoxview_thumbnail" }, // Options for thumbnails generated by YoxView
titleAttribute: "title", // The attribute of an img used for the text in YoxView. Use either "title" or "alt".
titleDisplayDuration: 2000 // The time in ms to display the image's title, after which it fades out.
};
this.infoButtons = {};
this.isOpen = false;
this.yoxviewSkins = {};
var ajaxLoader,
cacheVars = {},
cacheImg = new Image(),
countDisplay,
ctlButtons, // next and prev buttons
elementCount = 0,
currentItemIndex = 0,
currentLanguage = {},
currentMaxSize = {},
currentOptionsSetIndex,
currentViewIndex = 0,
currentViewIsInFrame = window != window.parent,
disableInfo = false,
flashDefaults = { wmode: "transparent", width: "100%", height: "100%", allowfullscreen: "true", allowscriptaccess: "true", hasVersion: 9 },
firstImage = true,
frameOffset,
helpPanel,
hideInfoTimeout,
hideMenuTimeout,
image1, image2,
images,
imagesCount = 0,
infoPanel,
infoPanelContent,
infoPanelLink,
infoPanelMinHeight = 30,
infoPanelWrap,
infoPinLink,
infoPinLinkImg,
infoText,
isFirstPanel = false,
isImageMode = true,
isPlaying = false,
isResizing = false,
itemVar,
loadedViews = [],
loaderTimeout,
loading = false,
mediaButtonsSize = { width: 100, height: 100 },
mediaLoader,
mediaPanelClass = "yoxview_mediaPanel",
mediaProviderUrls = {
vimeo: "http://vimeo.com/api/oembed.json",
myspace: "http://vids.myspace.com/index.cfm?fuseaction=oembed"
},
menuHidePosition = -42,
menuPanel,
nextBtn,
notification,
onOpenCallback,
options, optionsSets = [],
panel1, panel2,
playBtnText,
popup,
popupBackground,
popupMargins = {}, defaultPopupMargins = {},
popupTimeout,
popupWindow = $(Yox.getTopWindow()), // the window in which to create the YoxView popup (for use with frames)
popupWrap,
prevBtn,
resumePlay = false,
sprites,
tempImg = new Image(),
thumbnail,
thumbnailImg,
thumbnailPos,
thumbnailProperties,
windowDimensions,
yoxviewLanguages = {},
keyCodes = {
40: 'DOWN',
35: 'END',
13: 'ENTER',
36: 'HOME',
37: 'LEFT',
39: 'RIGHT',
32: 'SPACE',
38: 'UP',
72: 'h',
27: 'ESCAPE'
},
keyMappings;
// If the given options object is equal to any in the options set, return the existing set's index. Otherwise, add the new set and return its index:
function initOptionsSet(options) {
var optionsSetsLength = optionsSets.length;
for (var i = 0; i < optionsSetsLength; i++) {
if (Yox.compare(optionsSets[i], options))
return i;
}
optionsSets.push(options);
return optionsSetsLength;
}
function getAllowedThumbnailsSelector(options) {
return "a:has(img)" + (options.textLinksSelector !== null ? ",a" + options.textLinksSelector : "");
}
this.init = function(views, opt) {
var options = $.extend(true, {}, defaults, opt);
var optionsSetIndex;
if (optionsSets.length == 0) {
optionsSets.push(options);
optionsSetIndex = 0;
}
else
optionsSetIndex = opt ? initOptionsSet(options) : null;
function loadContents() {
views.each(function(i, view) {
view = $(view);
var viewIndex = loadedViews.length;
view.data("yoxview", {
viewIndex: viewIndex,
cacheVars: { cachedImagesCount: 0, cacheDirectionForward: true, cacheBufferLastIndex: null, currentCacheImg: 0 }
});
var viewData = view.data("yoxview");
if (optionsSetIndex)
viewData.optionsSet = optionsSetIndex;
options.allowedImageUrls = [Yox.Regex.image];
if (options.allowedUrls)
options.allowedImageUrls = options.allowedImageUrls.concat(options.allowedUrls);
// First, get image data from thumbnails:
var isSingleLink = view[0].tagName == "A";
var thumbnails = isSingleLink ? view : view.find(getAllowedThumbnailsSelector(options));
var viewImages = [];
var imageIndex = 0;
thumbnails.each(function(i, thumbnail) {
var $thumbnail = $(thumbnail);
var imageData = getImageDataFromThumbnail($thumbnail, options);
if (imageData) {
viewImages.push(imageData);
if (isSingleLink)
$thumbnail.data("yoxview").imageIndex = imageIndex;
else
$thumbnail.data("yoxview", { imageIndex: imageIndex, viewIndex: viewIndex });
imageIndex++;
}
});
if (options.images)
viewImages = viewImages.concat(options.images);
if (options.dataSource) {
Yox.dataSources[options.dataSource].getImagesData(options, function(data) {
viewImages = viewImages.concat(data.images);
viewData.images = viewImages;
if (data.title && options.thumbnailsOptions && options.thumbnailsOptions.setHeader) {
$(options.thumbnailsOptions.headerElement || "<h2>", {
html: data.title,
className: options.thumbnailsOptions.headerClass
}).appendTo(view);
}
var thumbnailsData = data.isGroup
? [$.extend(data, {
media: {
title: data.title + " (" + data.images.length + " images)",
alt: data.title
}
})]
: data.images;
createThumbnails(view, options, isSingleLink ? null : thumbnailsData, !data.createGroups ? null :
function(e) {
var viewData = $(e.currentTarget).data("yoxview");
var thumbnail = $(e.currentTarget);
var thumbnailData = thumbnail.data("yoxthumbs");
if (!viewData.imagesAreSet) {
thumbnail.css("cursor", "wait");
var newOptions = $.extend({}, options);
if (!newOptions.dataSourceOptions)
newOptions.dataSourceOptions = thumbnailData;
else
$.extend(newOptions.dataSourceOptions, thumbnailData);
Yox.dataSources[options.dataSource].getImagesData(newOptions, function(data) {
viewData.images = data.images;
viewData.imagesAreSet = true;
thumbnail.css("cursor", "");
$.yoxview.open(viewData.viewIndex);
});
}
else {
$.yoxview.open(viewData.viewIndex);
}
}
);
if (data.createGroups)
$.each(view.yoxthumbs("thumbnails"), function(i, thumbnail) {
thumbnail.data("yoxview", { viewIndex: ++viewIndex });
loadedViews.push($(thumbnail));
});
else {
$.each(view.yoxthumbs("thumbnails"), function(i, thumbnail) {
var currentViewIndex = imageIndex + i;
var thumbImg = thumbnail.children("img");
if (thumbImg.length == 0)
thumbImg = thumbnail;
viewImages[currentViewIndex].thumbnailImg = thumbImg;
thumbnail.data("yoxview", { imageIndex: i, viewIndex: viewIndex });
});
}
if (!$.yoxview.firstViewWithImages && data.images.length > 0) {
$.yoxview.firstViewWithImages = view;
if (options.cacheImagesInBackground)
$.yoxview.startCache();
}
});
}
else {
viewData.images = viewImages;
createThumbnails(view, options);
}
loadedViews.push(view);
if (!$.yoxview.firstViewWithImages && viewData.images && viewData.images != 0) {
$.yoxview.firstViewWithImages = view;
loadViewImages(view);
if (options.cacheImagesInBackground && imagesCount != 0) {
calculateCacheBuffer();
cacheImages(0);
}
}
});
}
// Init external files then proceed:
loadLanguage(options.lang, function(langData) {
loadSkin(options, function(skin) {
if (skin && skin.options)
$.extend(options, skin.options);
Yox.loadDataSource(options, loadContents);
});
});
}
function loadSkin(options, callback) {
if (options.skin) {
var skinName = options.skin;
if (!$.yoxview.yoxviewSkins[skinName]) {
var skinUrl = yoxviewPath + "skins/" + skinName + "/yoxview." + skinName;
$.ajax({
url: skinUrl + ".js",
dataType: "script",
success: function(data) {
if ($.yoxview.yoxviewSkins[skinName].css !== false)
Yox.addStylesheet(top.document, skinUrl + ".css");
if (callback)
callback($.yoxview.yoxviewSkins[skinName]);
},
error: function() {
alert("Error loading skin file " + skinUrl + ".js");
}
});
}
else if (callback)
callback($.yoxview.yoxviewSkins[skinName]);
}
else if (callback)
callback($.yoxview.yoxviewSkins[skinName]);
}
// Load the language file if not already loaded:
function loadLanguage(langName, callback) {
if (!yoxviewLanguages[langName]) {
yoxviewLanguages[langName] = {};
var langUrl = yoxviewPath + "lang/" + langName + ".js";
$.ajax({
url: langUrl,
async: false,
dataType: "json",
success: function(data) {
yoxviewLanguages[langName] = data;
if (callback)
callback(data);
},
error: function() {
alert("Error loading language file " + langUrl);
}
});
}
else if (callback)
callback(yoxviewLanguages[langName]);
}
function resetPopup() {
if (popup) {
popupWrap.remove();
popup = undefined;
prevBtn = undefined;
nextBtn = undefined;
image1 = undefined;
image2 = undefined;
panel1 = undefined;
panel2 = undefined;
currentItemIndex = 0;
$.yoxview.infoButtons = {};
}
createPopup();
}
function loadViewImages(view) {
var viewData = view.data("yoxview");
if (!images || currentViewIndex != viewData.viewIndex) {
if (!viewData.cacheVars)
viewData.cacheVars = { cachedImagesCount: 0, cacheDirectionForward: true, cacheBufferLastIndex: null, currentCacheImg: 0 };
images = viewData.images;
imagesCount = images.length;
currentViewIndex = viewData.viewIndex;
var isResetPopup = false;
var changeOptions = !currentOptionsSetIndex || (currentOptionsSetIndex != viewData.optionsSet);
if (changeOptions) {
currentOptionsSetIndex = viewData.optionsSet || 0;
options = optionsSets[currentOptionsSetIndex];
isResetPopup = true;
}
if (options.onLoadImages)
options.onLoadImages({ images: images, viewData: viewData });
else if ((prevBtn && imagesCount == 1) || (popup && !prevBtn && imagesCount > 0))
isResetPopup = true;
if (isResetPopup)
resetPopup();
cacheVars = viewData.cacheVars;
}
}
function getElementDimensions(type, originalDimensions, options) {
var size = originalDimensions && (originalDimensions.width || originalDimensions.height)
? { width: parseInt(originalDimensions.width), height: parseInt(originalDimensions.height) }
: options.defaultDimensions[type];
if (isNaN(size.width))
size.width = null;
if (isNaN(size.height))
size.height = null;
return size;
}
var supportedTypes = {
image: function(thumbnail, thumbnailHref, thumbImg, options) {
var imageData = null;
for (var i = 0; i < options.allowedImageUrls.length && !imageData; i++) {
if (thumbnailHref.match(options.allowedImageUrls[i])) {
imageData = {
src: thumbnail.attr("href"),
title: thumbImg.attr(options.titleAttribute),
alt: thumbImg.attr("alt")
};
}
}
return imageData;
},
flash: function(thumbnail, thumbnailHref, thumbImg, options) {
var imageData = null;
var matchFlash = thumbnailHref.match(Yox.Regex.flash);
var matchFlashVideo = matchFlash ? null : thumbnailHref.match(Yox.Regex.flashvideo);
if (matchFlash || matchFlashVideo) {
var urlData = Yox.getUrlData(thumbnailHref);
var elementSize = getElementDimensions("flash", urlData.queryFields, options);
if (urlData.queryFields) {
delete urlData.queryFields.width;
delete urlData.queryFields.height;
}
var flashPanel = $("<div>", {
className: "yoxview_element",
html: "<div class='yoxview_error'>Please install the latest version of the <a href='http://www.adobe.com/go/getflashplayer' target='_blank'>Flash player</a> to view content</div>"
});
var flashData = matchFlashVideo
? Yox.flashVideoPlayers[options.flashVideoPlayer](
options.flashVideoPlayerPath, urlData.path,
(urlData.queryFields && urlData.queryFields.image) ? urlData.queryFields.image :
thumbImg[0].nodeName == "IMG" ? thumbImg.attr("src") : null,
thumbImg.attr(options.titleAttribute))
: urlData.queryFields || {};
if (matchFlash)
flashData.swf = urlData.path;
$.extend(flashData, flashDefaults);
flashPanel.flash(flashData);
imageData = {
"element": flashPanel,
title: thumbImg.attr(options.titleAttribute)
};
$.extend(imageData, elementSize);
}
return imageData;
},
ooembed: function(thumbnail, thumbnailHref, thumbImg, options) {
var imageData = null;
for (videoProvider in Yox.Regex.video) {
if (thumbnailHref.match(Yox.Regex.video[videoProvider])) {
imageData = {
provider: videoProvider,
url: thumbnailHref
};
break;
}
}
return imageData;
},
inline: function(thumbnail, thumbnailHref, thumbImg, options) {
if (!options.allowInternalLinks)
return null;
var imageData = null;
var urlData = Yox.getUrlData(thumbnailHref);
if (urlData && urlData.anchor) {
var element = $("#" + urlData.anchor);
if (element.length != 0) {
var elementSize = { width: parseInt(element.css("width")), height: parseInt(element.css("height")) };
element.css({
position: "absolute",
top: 0,
left: 0,
width: "100%",
height: "100%",
display: "block"
});
imageData = {
type: "inlineElement",
"element": element,
title: element.attr("title")
};
var padding = {
horizontal: parseInt(element.css("padding-right")) + parseInt(element.css("padding-left")),
vertical: parseInt(element.css("padding-top")) + parseInt(element.css("padding-bottom"))
};
elementSize.width = isNaN(elementSize.width) ? null : elementSize.width + padding.horizontal;
elementSize.height = isNaN(elementSize.height) ? null : elementSize.height + padding.vertical;
$.extend(imageData, elementSize);
if (padding.horizontal != 0 || padding.vertical != 0)
imageData.padding = padding;
element.remove();
}
}
return imageData;
},
iframe: function(thumbnail, thumbnailHref, thumbImg, options) {
var imageData = null;
var thumbnailTarget = thumbnail.attr("target");
if (thumbnailTarget && thumbnailTarget == "yoxview") {
var urlData = Yox.getUrlData(thumbnailHref);
if (urlData && urlData.path) {
var iframeSize = getElementDimensions("iframe", urlData.queryFields, options);
if (urlData.queryFields) {
delete urlData.queryFields.width;
delete urlData.queryFields.height;
}
imageData = {
"element": $("<iframe>", {
src: Yox.urlDataToPath(urlData),
className: "yoxview_element"
}),
title: thumbImg.attr("title"),
frameborder: "0"
}
$.extend(imageData, iframeSize);
}
}
return imageData;
}
};
function getImageDataFromThumbnail(thumbnail, options) {
var imageData = {};
var thumbnailHref = thumbnail.attr("href");
var thumbImg = thumbnail.children("img:first");
if (thumbImg.length == 0)
thumbImg = thumbnail;
var imageData = {};
for (supportedType in supportedTypes) {
var media = supportedTypes[supportedType](thumbnail, thumbnailHref, thumbImg, options);
if (media) {
$.extend(media, {
contentType: supportedType,
elementId: elementCount++
});
imageData.media = media;
break;
}
}
if (!imageData.media)
return null;
imageData.thumbnailImg = thumbImg;
return imageData;
}
function createThumbnails(view, options, additionalImages, onClick) {
var clickHandler = function(e) {
var data = $(e.currentTarget).data("yoxview");
if (!data || data.imageIndex === null)
return true;
else {
e.preventDefault();
$.yoxview.open($(e.liveFired || e.currentTarget).data("yoxview").viewIndex, data.imageIndex);
}
};
if (view[0].tagName == "A")
view.bind("click.yoxview", clickHandler);
else if (!additionalImages)
view.delegate(getAllowedThumbnailsSelector(options), "click.yoxview", clickHandler);
else
view.yoxthumbs($.extend({
images: additionalImages,
enableOnlyMedia: false,
onClick: onClick || function(e) {
e.preventDefault();
if (options.thumbnailsOptions && options.thumbnailsOptions.onClick)
options.thumbnailsOptions.onClick(
$(e.currentTarget).data("yoxview").imageIndex,
$(e.currentTarget),
$(e.liveFired).data("yoxview").viewIndex);
else
$.yoxview.open($(e.liveFired || e.currentTarget).data("yoxview").viewIndex,
$(e.currentTarget).data("yoxview").imageIndex);
return false;
}
}, options.thumbnailsOptions));
}
function setThumbnail(setToPopupImage) {
var currentView = loadedViews[currentViewIndex];
thumbnail = currentView[0].tagName == "A"
? currentView
: images[currentItemIndex].thumbnailImg;
if (!thumbnail || thumbnail.length == 0)
thumbnail = images[0].thumbnailImg;
if (thumbnail) {
var thumbnailSrc = thumbnail.attr("src");
if (setToPopupImage && image1 && thumbnailSrc)
image1.attr("src", thumbnailSrc);
if (currentViewIsInFrame && !frameOffset && window.name)
frameOffset = $(top.document).find("[name='" + window.name + "']").offset();
thumbnailPos = thumbnail.offset();
thumbnailProperties = {
width: thumbnail.width(),
height: thumbnail.height(),
top: Math.round(thumbnailPos.top - popupWindow.scrollTop() + (frameOffset ? frameOffset.top : 0)),
left: Math.round(thumbnailPos.left + (frameOffset ? frameOffset.left : 0))
};
}
}
// Opens the viewer popup.
// Arguments:
// viewIndex: The 0-based index of the view to open, in case there are multiple instances of YoxView on the same page. Default is 0.
// imageIndex: The 0-based index of the image to open, in the specified view. Default is 0.
// callback: A function to call after the gallery has opened.
this.open = function(viewIndex, initialItemIndex, callback) {
var isJquery = this instanceof jQuery;
if (isJquery) {
if (viewIndex && typeof (viewIndex) == 'function')
callback = viewIndex;
var itemData = this.data("yoxview");
viewIndex = itemData.viewIndex;
initialItemIndex = itemData.imageIndex;
}
else if (typeof (viewIndex) == 'function') {
callback = viewIndex;
viewIndex = initialItemIndex = 0;
}
else if (typeof (initialItemIndex) == 'function') {
callback = initialItemIndex;
initialItemIndex = 0;
}
viewIndex = viewIndex || 0;
initialItemIndex = initialItemIndex || 0;
$(document).bind('keydown.yoxview', catchPress);
loadViewImages(loadedViews[viewIndex]);
if (!popup && imagesCount != 0)
createPopup();
$.yoxview.selectImage(initialItemIndex);
popupWrap.stop().css({ opacity: 0, display: "block" }).animate({ opacity: 1 }, "slow", function() { popupWrap.css("opacity", "") });
if (options.cacheImagesInBackground)
cacheImages(initialItemIndex);
if (callback)
onOpenCallback = callback;
return isJquery ? this : false;
}
this.selectImage = function(itemIndex) {
$.yoxview.currentImage = images[itemIndex];
currentItemIndex = itemIndex;
setThumbnail(true);
thumbnail.blur();
panel1.css({
"z-index": "1",
width: "100%",
height: "100%"
});
panel2.css({
"display": "none",
"z-index": "2"
});
firstImage = true;
popup.css(thumbnailProperties);
this.select(itemIndex);
}
this.refresh = function() {
resumePlay = isPlaying;
if (isPlaying)
stopPlay();
setImage(currentItemIndex);
if (resumePlay)
startPlay();
};
//var optionsRequiringUpdate =
this.options = function(opt, value) {
if (!opt)
return this;
if (value && typeof (opt) === "string") {
var pName = opt;
opt = {};
opt[pName] = value;
}
if (this instanceof jQuery) {
var yoxviewData = this.data("yoxview");
if (yoxviewData) {
$.extend(optionsSets[yoxviewData.optionsSet || 0], opt);
this.yoxview("update");
}
return this;
}
else {
$.each(optionsSets, function(i, optionsSet) {
$.extend(optionsSet, opt);
});
$.yoxview.update();
}
};
// Displays the specified image and shows the (optionally) specified button. Use when the viewer is open.
// Arguments:
// imageIndex: The 0-based index of the image to display.
// pressedBtn: a jQuery element of a button to display momentarily in the viewer.
// For example, if the image has been selected by pressing the Next button
// on the keyboard, specify the Next button. If no button should be display, leave blank.
this.select = function(itemIndex, pressedBtn, viewIndex) {
if (typeof pressedBtn === "number") {
viewIndex = pressedBtn;
pressedBtn = undefined;
}
viewIndex = viewIndex || 0;
if (!isResizing) {
if (itemIndex < 0) {
itemIndex = imagesCount - 1;
if (options.onEnd) {
options.onEnd();
return;
}
}
else if (itemIndex == imagesCount) {
itemIndex = 0;
if (options.onEnd) {
options.onEnd();
return;
}
}
if (!isPlaying && pressedBtn)
flicker(pressedBtn);
$.yoxview.currentImage = images[itemIndex];
currentItemIndex = itemIndex;
setImage(currentItemIndex);
// Set the cache buffer, if required:
calculateCacheBuffer();
// Handle event onSelect:
if (options.onSelect)
options.onSelect(itemIndex, images[itemIndex]);
}
}
this.prev = function(continuePlaying) {
cacheVars.cacheDirectionForward = false;
this.select(currentItemIndex - 1, prevBtn);
if (isPlaying && continuePlaying !== true)
stopPlay();
}
this.next = function(continuePlaying) {
cacheVars.cacheDirectionForward = true;
this.select(currentItemIndex + 1, nextBtn);
if (isPlaying && continuePlaying !== true)
stopPlay();
}
this.first = function() {
if (!options.disableNotifications)
longFlicker("first");
this.select(0);
if (isPlaying)
stopPlay();
};
this.last = function() {
if (!options.disableNotifications)
longFlicker("last");
this.select(imagesCount - 1);
if (isPlaying)
stopPlay();
};
this.setDefaults = function(options) {
$.extend(true, defaults, options);
};
this.play = function() {
if (!this.isOpen || imagesCount == 1)
return;
cacheVars.cacheDirectionForward = true;
if (!isPlaying) {
if (!options.disableNotifications)
longFlicker("play");
startPlay();
}
else {
if (!options.disableNotifications)
longFlicker("pause");
stopPlay();
}
};
function flicker(button) {
if (button.css("opacity") == 0)
button.stop().animate({ opacity: 0 }, options.buttonsFadeTime, fadeOut(button));
}
function longFlicker(notificationName) {
notification.css("background-position", sprites.getBackgroundPosition("notifications", notificationName));
notification.stop().fadeIn(options.buttonsFadeTime, function() {
$(this).delay(500)
.fadeOut(options.buttonsFadeTime);
});
}
function fadeIn(button) {
$(button).stop().animate({ opacity: 0 }, options.buttonsFadeTime);
}
function fadeOut(button) {
$(button).stop().animate({ opacity: 0.5 }, options.buttonsFadeTime);
}
this.close = function() {
if (!this.isOpen)
return;
this.closeHelp();
setThumbnail(false);
resizePopup(thumbnailProperties, function() { $.yoxview.isOpen = false; });
hideMenuPanel();
if (infoPanel)
hideInfoPanel(function() {
infoText.html("");
});
newPanel.animate({
width: thumbnailProperties.width,
height: thumbnailProperties.height
}, options.popupResizeTime, function() {
newPanel.css("opacity", 1);
});
popupWrap.stop().fadeOut(1000);
if (isPlaying)
stopPlay();
swipePanels();
if (options.onClose)
options.onClose();
$(document).unbind("keydown.yoxview");
isResizing = false;
}
this.help = function() {
if (!this.isOpen)
return;
if (helpPanel.css("display") == "none")
helpPanel.css("display", "block").stop().animate({ opacity: 0.8 }, options.buttonsFadeTime);
else
this.closeHelp();
}
this.closeHelp = function() {
if (helpPanel.css("display") != "none")
helpPanel.stop().animate({ opacity: 0 }, options.buttonsFadeTime, function() {
helpPanel.css("display", "none");
});
}
this.clickBtn = function(fn, stopPlaying) {
if (stopPlaying && isPlaying)
stopPlay();
fn.call(this);
return false;
}
function catchPress(e) {
if ($.yoxview && $.yoxview.isOpen) {
var pK = keyCodes[e.keyCode];
var calledFunction = $.yoxview[keyMappings[pK]];
if (calledFunction) {
e.preventDefault();
calledFunction.apply($.yoxview);
return false;
}
return true;
}
return true;
}
function createMenuButton(_title, btnFunction, stopPlay) {
var btn = "";
var btnSpan = "";
if (btnFunction !== "help") {
btn = $("<a>", {
href: "#",
click: function() {
return $.yoxview.clickBtn($.yoxview[btnFunction], stopPlay);
}
});
btnSpan = $("<span>" + _title + "</span>");
btnSpan.css("opacity", "0")
.appendTo(btn);
btn.append(sprites.getSprite("icons", btnFunction));
}
else if (btnFunction == "help") {
btn = $("<a>", {
href: "#"
});
btnSpan = $("<span></span>");
btnSpan.css("opacity", "0")
.appendTo(btn);
}
return btn;
}
// Prev and next buttons:
function createNavButton(_function, _side, singleImage) {
var navBtnImg = new Image();
navBtnImg.src = options.imagesFolder + _side + ".png";
var navBtn = $("<a>", {
css: {
"background": "url(" + navBtnImg.src + ") no-repeat " + _side + " center",
"opacity": "0",
"outline": "0"
},
className: "yoxview_ctlBtn",
href: "#"
});
navBtn.css(_side, "0");
if (!singleImage) {
navBtn.click(function() {
this.blur();
return $.yoxview.clickBtn(_function, true);
});
if (options.buttonsFadeTime != 0) {
navBtn.hover(
function() {
if ($.yoxview.isOpen)
$(this).stop().animate({ opacity: 0.6 }, options.buttonsFadeTime);
},
function() {
$(this).stop().animate({ opacity: 0 }, options.buttonsFadeTime);
}
);
}
}
else
navBtn.css("cursor", "default");
return navBtn;
}
popupWindow.bind("resize.yoxview", function() {
windowDimensions = getWindowDimensions();
if ($.yoxview.isOpen)
$.yoxview.resize();
});
function calculateMargins() {
var margins = typeof (options.popupMargin) == "number" ? [String(options.popupMargin)] : options.popupMargin.split(" ", 4);
popupMargins.top = parseInt(margins[0]);
switch (margins.length) {
case 1:
popupMargins.bottom = popupMargins.right = popupMargins.left = popupMargins.top;
break;
case 2:
popupMargins.bottom = popupMargins.top;
popupMargins.right = popupMargins.left = parseInt(margins[1]);
break;
case 3:
popupMargins.bottom = parseInt(margins[2]);
popupMargins.right = popupMargins.left = parseInt(margins[1]);
break;
default:
$.extend(popupMargins, {
right: parseInt(margins[1]),
bottom: parseInt(margins[2]),
left: parseInt(margins[3])
});
break;
}
popupMargins.totalHeight = popupMargins.top + popupMargins.bottom;
popupMargins.totalWidth = popupMargins.left + popupMargins.right;
if (options.renderInfoExternally)
$.extend(defaultPopupMargins, popupMargins);
}
function createPopup() {
calculateMargins();
windowDimensions = getWindowDimensions();
sprites = new Yox.Sprites({
notifications: {
width: 59,
height: 59,
sprites: ['empty', 'playRTL', 'play', 'pause', 'last', 'first']
},
icons: {
width: 18,
height: 18,
sprites: ['close', 'help', 'playpause', 'link', 'pin', 'unpin', 'play', 'pause', 'right', 'left']
},
menu: {
height: 42,
sprites: ['back']
}
}, options.imagesFolder + "sprites.png", options.imagesFolder + "empty.gif");
keyMappings = {
RIGHT: options.isRTL ? 'prev' : 'next',
DOWN: 'next',
UP: 'prev',
LEFT: options.isRTL ? 'next' : 'prev',
ENTER: 'play',
HOME: 'first',
END: 'last',
SPACE: 'next',
h: 'help',
ESCAPE: 'close'
};
currentLanguage = yoxviewLanguages[options.lang];
var skin = options.skin ? $.yoxview.yoxviewSkins[options.skin] : null;
popup = $("<div>", {
id: 'yoxview',
click: function(e) { e.stopPropagation(); }
});
popupWrap = $("<div>", {
id: "yoxview_popupWrap",
click: function(e) { e.preventDefault(); $.yoxview.clickBtn($.yoxview.close, true); }
});
if (options.skin)
popupWrap.attr("className", "yoxview_" + options.skin);
if (options.backgroundOpacity === 0)
popupWrap.css("background", "none")
else if (Yox.Support.rgba())
popupWrap.css("background-color", Yox.hex2rgba(options.backgroundColor, options.backgroundOpacity));
popupWrap.appendTo($(top.document.getElementsByTagName("body")[0])).append(popup);
panel1 = $("<div>", {
className: "yoxview_imgPanel",
css: {
"z-index": "2"
}
});
panel2 = $("<div>", {
className: "yoxview_imgPanel",
css: {
"z-index": "1",
"display": "none"
}
});
// the first image:
image1 = $("<img />", {
className: "yoxview_fadeImg",
css: {
"display": "block",
"width": "100%",
"height": "100%"
}
});
// the second image:
image2 = $("<img />", {
className: "yoxview_fadeImg",
css: {
"display": "block",
"width": "100%",
"height": "100%"
}
});
panel1.data("yoxviewPanel", { image: image1 })
.append(image1).appendTo(popup);
panel2.data("yoxviewPanel", { image: image2 })
panel2.append(image2).appendTo(popup);
var singleImage = imagesCount == 1;
if (singleImage && !images[0].media.title)
options.renderInfo = true; //Changed By: Mahadev P
// the menu:
if (options.renderMenu !== false) {
var menuPanelWrap = $("<div>", {
className: "yoxview_popupBarPanel yoxview_top"
});
if (options.autoHideMenu !== false) {
menuPanelWrap.hover(
function() {
if ($.yoxview.isOpen)
showMenuPanel();
},
function() {
if ($.yoxview.isOpen)
hideMenuPanel();
}
);
}
menuPanel = $("<div>", {
id: "yoxview_menuPanel"
});
if (Yox.Support.rgba() && options.menuBackgroundColor)
menuPanel.css("background", Yox.hex2rgba(options.menuBackgroundColor, options.menuBackgroundOpacity || 0.8));
var helpBtn = createMenuButton(currentLanguage.Help, "help", false);
$.yoxview.infoButtons.playBtn = createMenuButton(currentLanguage.Slideshow, "play", false);
playBtnText = $.yoxview.infoButtons.playBtn.children("span");
menuPanel.append(
createMenuButton(currentLanguage.Close, "close", true),
helpBtn,
$.yoxview.infoButtons.playBtn
);
if (singleImage) {
$.yoxview.infoButtons.playBtn.css("display", "none");
helpBtn.css("display", "none");
menuPanel.css({
width: 58
});
}
menuPanel.find("a:last-child").attr("class", "last");
menuPanelWrap.append(menuPanel).appendTo(popup);
menuPanel.delegate("a", "mouseenter", function() {
$(this).stop().animate({ top: "8px" }, "fast").find("span").stop().animate({ opacity: 1 }, "fast");
})
.delegate("a", "mouseleave", function() {
$(this).stop().animate({ top: "0" }, "fast").find("span").stop().animate({ opacity: 0 }, "fast");
});
}
if (options.renderButtons !== false && (!singleImage || !$.support.opacity)) {
// prev and next buttons:
prevBtn = createNavButton($.yoxview.prev, options.isRTL ? "right" : "left", singleImage);
nextBtn = createNavButton($.yoxview.next, options.isRTL ? "left" : "right", singleImage);
popup.append(prevBtn, nextBtn);
if (singleImage && !$.support.opacity) {
ctlButtons = $();
}
else
ctlButtons = popup.find(".yoxview_ctlBtn");
}
else
ctlButtons = $();
// add the ajax loader:
ajaxLoader = $("<div>", {
id: "yoxview_ajaxLoader",
className: "yoxview_notification",
css: {
"display": "none"
}
});
ajaxLoader.append($("<img>", {
src: options.imagesFolder + "popup_ajax_loader.gif",
alt: currentLanguage.Loading,
css: {
width: 32,
height: 32,
"background-image": "url(" + options.imagesFolder + "sprites.png)",
"background-position": sprites.getBackgroundPosition("notifications", "empty")
}
}))
.appendTo(popup);
// notification image
if (!options.disableNotifications) {
notification = $("<img>", {
className: "yoxview_notification"
});
popup.append(notification);
}
// help:
helpPanel = $("<div>", {
id: "yoxview_helpPanel",
href: "#",
title: currentLanguage.CloseHelp,
css: {
"background": "url(" + options.imagesFolder + "help_panel.png) no-repeat center top",
"direction": currentLanguage.Direction,
"opacity": "0"
},
click: function() {
return $.yoxview.clickBtn($.yoxview.help, false);
}
});
var helpTitle = document.createElement("h1");
helpTitle.innerHTML = currentLanguage.Help.toUpperCase();
var helpText = document.createElement("p");
helpText.innerHTML = currentLanguage.HelpText;
var closeHelp = document.createElement("span");
closeHelp.id = "yoxview_closeHelp";
closeHelp.innerHTML = currentLanguage.CloseHelp;
helpPanel.append(helpTitle).append(helpText).append(closeHelp).appendTo(popup);
// popup info:
if (options.renderInfo !== false) {
infoPanel = $("<div>", {
id: "yoxview_infoPanel",
click: function(e) { e.stopPropagation(); }
});
if (options.infoBackOpacity === 0) {
infoPanel.css("background", "none");
infoPanelContent = infoPanel;
}
else {
if (Yox.Support.rgba()) {
infoPanelContent = infoPanel;
infoPanel.css("background-color", Yox.hex2rgba(options.infoBackColor, options.infoBackOpacity));
}
else {
infoPanel.append(
$("<div>", {
id: "yoxview_infoPanelBack",
css: {
"background": options.infoBackColor,
"opacity": options.infoBackOpacity
}
})
);
infoPanelContent = $("<div>", {
id: "yoxview_infoPanelContent"
});
}
}
countDisplay = $("<span>", {
id: "yoxview_count"
});
infoText = $("<div>", {
id: "yoxview_infoText"
});
if (singleImage) {
infoText.css("margin-left", "10px");
countDisplay.css("display", "none");
}
//infoPanelContent.append(countDisplay);
if (options.renderInfoPin !== false) {
infoPinLinkImg = sprites.getSprite("icons", options.autoHideInfo ? "pin" : "unpin");
infoPinLink = $("<a>", {
className: "yoxviewInfoLink",
href: "#",
title: options.autoHideInfo ? currentLanguage.PinInfo : currentLanguage.UnpinInfo,
css: { display: 'inline' },
click: function(e) {
e.preventDefault();
options.autoHideInfo = !options.autoHideInfo;
infoPinLinkImg.css("background-position", sprites.getBackgroundPosition("icons", options.autoHideInfo ? "pin" : "unpin"));
this.title = options.autoHideInfo ? currentLanguage.PinInfo : currentLanguage.UnpinInfo;
}
});
infoPinLink.append(infoPinLinkImg).appendTo(infoPanelContent);
}
if (skin && skin.infoButtons) {
var skinButtons = skin.infoButtons(options, currentLanguage, sprites, popupWrap, popup);
if (options.infoButtons)
$.extend(options.infoButtons, skinButtons);
else
options.infoButtons = skinButtons;
}
if (options.infoButtons) {
$.extend($.yoxview.infoButtons, options.infoButtons);
for (infoButton in options.infoButtons) {
options.infoButtons[infoButton].attr("className", "yoxviewInfoLink").css("display", "block").appendTo(infoPanelContent);
}
}
if (options.linkToOriginalContext !== false) {
infoPanelLink = $("<a>", {
className: "yoxviewInfoLink",
target: "_blank",
title: currentLanguage.OriginalContext
});
infoPanelLink.append(sprites.getSprite("icons", "link")).appendTo(infoPanelContent);
}
infoPanelContent.append(infoText);
if (!Yox.Support.rgba())
infoPanel.append(infoPanelContent);
infoPanel.appendTo(options.renderInfoExternally ? popupWrap : popup);
if (!options.renderInfoExternally) {
infoPanelWrap = $("<div>", {
className: "yoxview_popupBarPanel yoxview_bottom"
});
infoPanelWrap.hover(
function() {
if ($.yoxview.isOpen && !disableInfo && options.autoHideInfo !== false)
setInfoPanelHeight();
},
function() {
if ($.yoxview.isOpen && !disableInfo && options.autoHideInfo !== false)
hideInfoPanel();
}
);
infoPanel.wrap(infoPanelWrap);
infoPanelWrap = infoPanel.parent();
}
}
// set the background if no RGBA support found:
if (!Yox.Support.rgba()) {
popupBackground = $("<div>", {
css: {
"position": "fixed",
"height": "100%",
"width": "100%",
"top": "0",
"left": "0",
"background": options.backgroundColor,
"z-index": "1",
"opacity": options.backgroundOpacity
}
}).appendTo(popupWrap);
}
}
// Cache stuff:
$(cacheImg).load(function() {
$.extend(images[cacheVars.currentCacheImg].media, {
width: this.width,
height: this.height,
loaded: true
});
advanceCache();
})
.error(function() {
advanceCache();
});
function advanceCache() {
cacheVars.cachedImagesCount++;
if (cacheVars.cachedImagesCount == imagesCount)
cacheVars.cacheComplete = true;
else
getCacheBuffer();
}
this.startCache = function() {
loadViewImages(this.firstViewWithImages);
calculateCacheBuffer();
cacheImages(0);
}
function getCacheBuffer() {
if (!options.cacheBuffer || cacheVars.currentCacheImg != cacheVars.cacheBufferLastIndex)
cacheImages(cacheVars.currentCacheImg + (cacheVars.cacheDirectionForward ? 1 : -1));
}
function calculateCacheBuffer() {
if (options.cacheBuffer) {
cacheVars.cacheBufferLastIndex = cacheVars.cacheDirectionForward ? currentItemIndex + options.cacheBuffer : currentItemIndex - options.cacheBuffer;
if (cacheVars.cacheBufferLastIndex < 0)
cacheVars.cacheBufferLastIndex += imagesCount;
else if (cacheVars.cacheBufferLastIndex >= imagesCount)
cacheVars.cacheBufferLastIndex -= imagesCount;
}
}
function cacheImages(imageIndexToCache) {
if (cacheVars.cacheComplete)
return;
if (imageIndexToCache == imagesCount)
imageIndexToCache = 0;
else if (imageIndexToCache < 0)
imageIndexToCache += imagesCount;
var image = images[imageIndexToCache].media;
cacheVars.currentCacheImg = imageIndexToCache;
if (image && !image.loaded) {
if (!image.contentType || image.contentType === "image")
cacheImg.src = image.src;
else
loadMedia(image, function() {
advanceCache();
});
}
else
getCacheBuffer();
}
// End cache stuff
function showLoaderIcon() {
loading = true;
clearTimeout(loaderTimeout);
try {
ajaxLoader.stop();
} catch (e) {
// alert(e);
}
loaderTimeout = setTimeout(function() {
ajaxLoader.css("opacity", "0.6").fadeIn(options.buttonsFadeTime);
},
options.buttonsFadeTime
);
}
function hideLoaderIcon() {
loading = false;
clearTimeout(loaderTimeout);
ajaxLoader.stop().fadeOut(options.buttonsFadeTime);
}
function setImage(itemIndex) {
if (!isPlaying)
showLoaderIcon();
loadAndDisplayMedia($.yoxview.currentImage.media);
}
function resizePopup(popupPosition, callback) {
popup.stop().animate(popupPosition, options.popupResizeTime, callback);
//popup.stop().animate(popupPosition, 5000, callback);
}
function startPlay() {
if (imagesCount == 1)
return;
isPlaying = true;
if (playBtnText)
playBtnText.text(currentLanguage.Pause);
else if ($.yoxview.infoButtons.playBtn)
$.yoxview.infoButtons.playBtn.attr("title", currentLanguage.Pause);
if ($.yoxview.infoButtons.playBtn)
$.yoxview.infoButtons.playBtn.find("img").css("background-position", sprites.getBackgroundPosition("icons", "pause"));
if (currentItemIndex < imagesCount - 1) {
popupTimeout = setTimeout(
function() {
$.yoxview.next(true);
},
options.playDelay
);
}
else {
if (options.loopPlay)
popupTimeout = setTimeout(
function() {
$.yoxview.select(0, null);
},
options.playDelay
);
else
stopPlay();
if (options.onEnd)
setTimeout(options.onEnd, options.playDelay);
}
}
function stopPlay() {
clearTimeout(popupTimeout);
isPlaying = false;
if (playBtnText)
playBtnText.text(currentLanguage.Play);
else if ($.yoxview.infoButtons.playBtn)
$.yoxview.infoButtons.playBtn.attr("title", currentLanguage.Play);
if ($.yoxview.infoButtons.playBtn)
$.yoxview.infoButtons.playBtn.find("img").css("background-position", sprites.getBackgroundPosition("icons", "play"));
}
function blink(_element) {
_element.animate({ opacity: 0.8 }, 1000, function() {
$(this).animate({ opacity: 0.2 }, 1000, blink($(this)));
});
}
var newPanel = panel2;
var oldPanel = panel1;
function getWindowDimensions() {
var widthVal = popupWindow.width();
var heightVal = popupWindow.height();
var returnValue = {
height: heightVal,
width: widthVal,
usableArea: {
height: heightVal - popupMargins.totalHeight,
width: widthVal - popupMargins.totalWidth
}
};
return returnValue;
}
function getImagePosition(imageSize) {
var imagePosition = (imageSize.width && imageSize.height)
? Yox.fitImageSize(imageSize, windowDimensions.usableArea)
: {
width: imageSize.width ? Math.min(imageSize.width, windowDimensions.usableArea.width) : windowDimensions.usableArea.width,
height: imageSize.height ? Math.min(imageSize.height, windowDimensions.usableArea.height) : windowDimensions.usableArea.height
};
imagePosition.top = popupMargins.top + Math.round((windowDimensions.usableArea.height - imagePosition.height) / 2);
imagePosition.left = popupMargins.left + Math.round((windowDimensions.usableArea.width - imagePosition.width) / 2);
return imagePosition;
}
this.resize = function(updateInfoPanel) {
if (isPlaying) {
resumePlay = true;
stopPlay();
}
var newImagePosition = getImagePosition(currentMaxSize);
newPanel.css({ width: "100%", height: "100%" });
isResizing = true;
if (!isImageMode)
ctlButtons.css({ top: Math.round((newImagePosition.height - mediaButtonsSize.height) / 2) });
resizePopup(newImagePosition,
function() {
var newImageSize = { width: popup.width(), height: popup.height() };
if (currentMaxSize.padding) {
newImageSize.width -= currentMaxSize.padding.horizontal;
newImageSize.height -= currentMaxSize.padding.vertical;
}
newPanel.css(newImageSize);
isResizing = false;
if (infoPanel && updateInfoPanel !== false)
setInfoPanelHeight();
if (resumePlay) {
startPlay();
resumePlay = false;
}
}
);
}
function setInfoPanelHeight(callback) {
clearTimeout(hideInfoTimeout);
var titleHeight = infoText.outerHeight();
if (titleHeight < infoPanelMinHeight)
titleHeight = infoPanelMinHeight;
if (infoPanel.height() !== titleHeight) {
infoPanel.stop().animate({ height: titleHeight }, 500, function() {
if (options.renderInfoExternally) {
var infoPanelPosition = infoPanel.position();
$.extend(popupMargins, defaultPopupMargins);
if (infoPanelPosition.top === 0)
popupMargins.top += titleHeight;
else
popupMargins.bottom += titleHeight;
popupMargins.totalHeight = popupMargins.top + popupMargins.bottom;
windowDimensions = getWindowDimensions();
$.yoxview.resize(false);
}
if (callback)
callback();
});
}
}
function hideInfoPanel(callback) {
clearTimeout(hideInfoTimeout);
infoPanel.stop().animate({ height: 0 }, 500, function() {
if (callback)
callback();
});
}
function hideMenuPanel(callback) {
if (menuPanel) {
clearTimeout(hideMenuTimeout);
menuPanel.stop().animate({ top: menuHidePosition }, 500, function() {
if (callback)
callback();
});
}
}
function showMenuPanel(callback) {
if (menuPanel) {
clearTimeout(hideMenuTimeout);
menuPanel.stop().animate({ top: 0 }, 500, function() {
if (callback)
callback();
});
}
}
function swipePanels() {
oldPanel = newPanel;
newPanel = isFirstPanel ? panel2 : panel1;
isFirstPanel = !isFirstPanel;
}
function changeMedia(media) {
var mediaIsImage = media.contentType === "image" || !media.contentType;
if (mediaIsImage && disableInfo && infoPanelWrap)
infoPanelWrap.css("display", "block");
clearTimeout(hideInfoTimeout);
swipePanels();
var panelData = newPanel.data("yoxviewPanel");
currentMaxSize.width = media.width;
currentMaxSize.height = media.height;
currentMaxSize.padding = media.padding;
if (infoPanel) {
var infoTextValue = media.title || "";
if (options.showDescription && media.description)
infoTextValue += infoTextValue != ""
? "<div id='yoxview_infoTextDescription'>" + media.description + "</div>"
: media.description;
infoText.html(infoTextValue);
if (imagesCount > 1)
countDisplay.html(currentItemIndex + 1 + "/" + imagesCount);
if (infoPanelLink) {
if ($.yoxview.currentImage.link)
infoPanelLink.attr("href", $.yoxview.currentImage.link).css("display", "inline");
else
infoPanelLink.css("display", "none");
}
}
var newImagePosition = getImagePosition(media);
if (mediaIsImage) {
currentImageElement = isFirstPanel ? image1 : image2;
currentImageElement.attr({
src: media.src,
title: media.title,
alt: media.alt
});
panelData.image = currentImageElement;
// change to image mode:
if (!panelData.isImage && panelData.element) {
panelData.element.css("display", "none");
panelData.image.css("display", "block");
panelData.isImage = true;
}
if (!isImageMode) {
if (options.renderButtons)
ctlButtons.css({ "height": "100%", "width": "50%", "top": "0" });
disableInfo = false;
isImageMode = true;
}
}
else {
if (panelData.element && panelData.elementId != media.elementId) {
panelData.element.remove();
panelData.element = undefined;
}
if (!panelData.element) {
if (media.html) {
panelData.element = $("<div>", {
className: mediaPanelClass
});
popup.append(panelData.element);
}
else {
popup.append(media.element);
panelData.element = media.element;
}
}
if (media.html)
panelData.element.html(media.html);
newPanel = panelData.element;
if (isImageMode) {
if (infoPanelWrap) {
if (options.autoHideInfo !== false)
hideInfoPanel();
infoPanelWrap.css("display", "none");
disableInfo = true;
}
if (options.renderButtons)
ctlButtons.css({
"width": mediaButtonsSize.width,
"height": mediaButtonsSize.height
});
isImageMode = false;
}
if (options.renderButtons)
ctlButtons.css({ top: (newImagePosition.height - mediaButtonsSize.height) / 2 });
// change to element mode:
if (panelData.isImage === undefined || panelData.isImage) {
panelData.element.css("display", "block");
panelData.image.css("display", "none");
panelData.isImage = false;
}
}
var newImageDimensions = { width: newImagePosition.width, height: newImagePosition.height };
newPanel.css(firstImage ? { width: "100%", height: "100%"} : newImageDimensions);
if (loading)
hideLoaderIcon();
isResizing = true;
resizePopup(newImagePosition,
function() {
if (firstImage) {
$.yoxview.isOpen = true;
newPanel.css(newImageDimensions);
if (options.controlsInitialDisplayTime > 0) {
if (options.showButtonsOnOpen)
ctlButtons.animate({ opacity: 0.5 }, options.controlsInitialFadeTime, function() {
if (options.buttonsFadeTime != 0)
$(this).delay(options.controlsInitialDisplayTime).animate({ opacity: 0 }, options.controlsInitialFadeTime);
});
if (options.showBarsOnOpen) {
showMenuPanel(function() {
if (options.autoHideMenu !== false)
hideMenuTimeout = setTimeout(function() {
hideMenuPanel();
},
options.controlsInitialDisplayTime
);
});
if (infoPanel)
setInfoPanelHeight(function() {
if (options.autoHideInfo !== false)
hideInfoTimeout = setTimeout(function() { hideInfoPanel(); }, options.controlsInitialDisplayTime);
});
}
}
if (options.autoPlay)
$.yoxview.play();
if (options.onOpen)
options.onOpen();
if (onOpenCallback) {
onOpenCallback();
onOpenCallback = undefined;
}
firstImage = false;
}
if (currentMaxSize.padding) {
var newImageWidth = popup.width();
var newImageHeight = popup.height();
if (currentMaxSize.padding) {
newImageWidth -= currentMaxSize.padding.horizontal;
newImageHeight -= currentMaxSize.padding.vertical;
}
newPanel.css({ "width": newImageWidth + "px", "height": newImageHeight + "px" });
}
isResizing = false;
}
);
newPanel.css({ 'z-index': '2', opacity: 1 });
if (oldPanel)
oldPanel.css('z-index', '1');
if (!firstImage) {
newPanel.fadeIn(options.popupResizeTime, function() {
if (oldPanel)
oldPanel.css('display', 'none');
if (infoPanel)
setInfoPanelHeight(function() {
if (options.autoHideInfo !== false)
hideInfoTimeout = setTimeout(function() { hideInfoPanel(); }, options.titleDisplayDuration);
});
if (imagesCount > 1) {
if (options.cacheImagesInBackground && !cacheVars.cacheComplete)
cacheImages(currentItemIndex + (cacheVars.cacheDirectionForward ? 1 : -1));
if (isPlaying)
startPlay();
}
});
}
else {
newPanel.css({ display: "block", width: "100%", height: "100%" });
}
}
$(tempImg).load(function() {
if (this.width == 0) {
displayError("Image error");
return;
}
changeMedia($.extend({}, $.yoxview.currentImage.media, {
width: 620, //this.width, // set these properties to the required static sizes by Govardhana
height: 480 //this.height // set these properties to the required static sizes by Govardhana
}));
})
.error(function() {
displayError("Image not found:<br /><span class='errorUrl'>" + this.src + "</span>");
});
function loadMediaFromProvider(provider, url, availableSize, onLoad, onError) {
jQuery.jsonp({
url: (mediaProviderUrls[provider] || "http://oohembed.com/oohembed/"),
data: jQuery.extend({
"url": url,
"format": "json"
}, availableSize),
dataType: 'jsonp',
callbackParameter: "callback",
success: function(data) {
var media = {
title: data.title,
width: data.width,
height: data.height,
type: data.type
};
if (data.type === "video") {
media.html = data.html
.replace(/<embed /, "<embed wmode=\"transparent\" ")
.replace(/<param/, "<param name=\"wmode\" value=\"transparent\"><param")
.replace(/width=\"[\d]+\"/ig, "width=\"100%\"")
.replace(/height=\"[\d]+\"/ig, "height=\"100%\"");
}
else if (data.type === "photo") {
jQuery.extend(media, {
src: data.url,
alt: data.title,
type: "image"
});
}
onLoad(media);
},
error: function(errorSender, errorMsg) {
if (onError)
onError(errorSender, errorMsg);
}
});
};
function loadAndDisplayMedia(media) {
try {
if (!media)
throw ("Error: Media is unavailable.");
if (media.contentType === "image" || !media.contentType) {
// Resets the src attribute for the image - avoids a rendering problem in Chrome.
// $.opacity is tested so this isn't applied in IE (up to IE8),
// since it creates a problem with the image's fading:
if ($.support.opacity)
tempImg.src = "";
tempImg.src = media.src;
}
else {
if (!media.loaded && media.contentType == "ooembed") {
loadMedia(
media,
function(loadedMedia) {
changeMedia(loadedMedia);
},
function(errorSender) {
displayError("Error getting data from:<br /><span class='errorUrl'>" + errorSender.data.url + "</span>");
}
);
}
else
changeMedia($.yoxview.currentImage.media);
}
}
catch (error) {
displayError(error);
}
}
function loadMedia(media, onLoad, onError) {
if (media.contentType == "ooembed") {
loadMediaFromProvider(
media.provider,
media.url,
options.defaultDimensions.video,
function(mediaData) {
$.extend(media, mediaData, { loaded: true });
if (onLoad)
onLoad(media);
},
onError
);
}
}
function displayError(errorMsg) {
changeMedia({
html: "<span class='yoxview_error'>" + errorMsg + "</span>",
width: 500,
height: 300,
type: "error",
title: ""
});
}
this.update = function() {
var options;
if (this instanceof jQuery) {
options = optionsSets[this.data("yoxview").optionsSet || 0];
this.yoxview("unload", function(caller) { caller.yoxview(options) });
return this;
}
else {
options = optionsSets[0];
this.unload();
$.each(loadedViews, function(i, view) {
view.yoxview(options);
});
}
}
this.unload = function(callback) {
var caller = this;
if (!options)
return (this);
function doUnload() {
var allowedThumbnailsSelector = getAllowedThumbnailsSelector(options);
function removeFromView(view) {
try
{
view.undelegate(allowedThumbnailsSelector, "click.yoxview")
.removeData("yoxview")
.yoxthumbs("unload", "yoxview")
.find(allowedThumbnailsSelector).removeData("yoxview");
}
catch(e)
{
}
}
function removeFromDocument() {
popupWindow.unbind(".yoxview");
if (popup) {
popupWrap.remove();
popup = undefined;
}
}
if (caller instanceof jQuery) {
if (caller.data("yoxview"))
removeFromView(caller);
}
else {
jQuery.each(loadedViews, function(i, view) {
removeFromView(view);
});
removeFromDocument();
}
if (callback)
callback(caller);
else
return caller;
}
if (options.onBeforeUnload)
options.onBeforeUnload(doUnload)
else
doUnload();
};
}

})(jQuery);