|
@@ -0,0 +1,2227 @@
|
|
|
+/*!
|
|
|
+ * 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: true, // 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: true, // If true, displays the Prev/Next buttons momentarily when the popup opens.
|
|
|
+ showDescription: true, // 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 = $("<a>", {
|
|
|
+ href : "#",
|
|
|
+ click : function(){
|
|
|
+ return $.yoxview.clickBtn($.yoxview[btnFunction], stopPlay);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ var btnSpan = $("<span>" + _title + "</span>");
|
|
|
+ btnSpan.css("opacity", "0")
|
|
|
+ .appendTo(btn);
|
|
|
+
|
|
|
+ btn.append(sprites.getSprite("icons", btnFunction));
|
|
|
+ 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 = false;
|
|
|
+
|
|
|
+ // 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);
|
|
|
+ ajaxLoader.stop();
|
|
|
+ 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: this.width,
|
|
|
+ height: this.height
|
|
|
+ }));
|
|
|
+ })
|
|
|
+ .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){
|
|
|
+ view.undelegate(allowedThumbnailsSelector, "click.yoxview")
|
|
|
+ .removeData("yoxview")
|
|
|
+ .yoxthumbs("unload", "yoxview")
|
|
|
+ .find(allowedThumbnailsSelector).removeData("yoxview");
|
|
|
+ }
|
|
|
+ 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);
|