https://inventivodesign.com/js/lightbox.js?v=1.5.4b

1/******************************************************************************************************
2 *                                             SPIME START 
3 ******************************************************************************************************/
4var LightBox = {};
5
6/******************************************************************************************************
7 *                                               MAIN
8 *                                  called from body onLoad func    
9 ******************************************************************************************************/
10
11LightBox.initLinks = function(holder){
12	//Only in viewer mode
13	if(typeof window["EditorHelper"] == "undefined"){
14		var links;
15		if (holder){
16			links = holder.find("a[data-link-type='LIGHTBOX']");
17		}else{
18			links = $("a[data-link-type='LIGHTBOX']");
19		}
20		links.each(function(){
21			var currentLink = $(this);
22			currentLink.removeAttr("href");
23			currentLink.removeAttr("target");
24			currentLink.addClass("clickable");
25			//blocking media widgets to show lightbox
26			if (currentLink.closest(".item-box").find("[data-menu-name='PREVIEW_RAW']").length > 0 && currentLink.is(".image-link")){
27				currentLink.remove();
28			}
29			currentLink.unbind("click").bind("click",function(e){
30				e.stopPropagation();
31				//blocking media widgets to show lightbox
32				if (currentLink.closest(".item-box").find("[data-menu-name='PREVIEW_RAW']").length > 0){
33					e.preventDefault();
34					return false;
35				}
36				LightBox.itemClick($(this).closest(".item-content"));
37				return false;
38			});
39		});
40		
41		var registerLinks ;
42		if (holder){
43			registerLinks = holder.find("a[href^='register://'] , a[href^='registers://']");
44		}else{
45			registerLinks = $("a[href^='register://'], a[href^='registers://']");
46		}
47		if (registerLinks.length > 0){
48			if (typeof XPRSTranslator == "undefined"){
49				$("<script/>").attr("src", XPRSHelper.getServerPath() + "/translation_js").appendTo("head");
50				$("<script/>").attr("src", XPRSHelper.getServerPath() + "/js/lib/jquery.cookie.min.js").appendTo("head");
51				var loginWrapper = $("<div/>").attr("id","lightbox-menus-holder").css({"height":"100%","width": "100%","position":"fixed","top": "0px","left": "0px","display": "table","background-color": "rgba(0,0,0,0.1)","z-index":"99999999"}).hide();
52				$("body").append(loginWrapper);
53				loginWrapper.load(XPRSHelper.getServerPath() +  "/login?form_only=true")
54			}
55		}
56		registerLinks.each(function(){
57			var currentLink = $(this);
58			currentLink.attr("data-href",currentLink.attr("href").replace("register://","http://").replace("registers://","https://"));
59			currentLink.removeAttr("href");
60			currentLink.removeAttr("target");
61			currentLink.addClass("clickable");
62			currentLink.unbind("click").bind("click",function(e){
63				e.stopPropagation();
64				XPRSHelper.invokeLogin(function(){
65					location.href = currentLink.attr("data-href");
66				  },"register");
67				return false;
68			});
69		});
70
71	}
72};
73
74
75LightBox.itemClick = function(currentItem){
76	var imageSrc = currentItem.attr("data-bgimg");
77	var videoSrc = "";
78	var videoFrame = currentItem.find(".video-frame");
79	if (videoFrame.length > 0){
80		//var videoFrame = currentItem.find(".video-frame");
81		if (videoFrame.length > 0){
82			videoSrc = videoFrame.attr("src");
83		}
84	}
85	if (imageSrc == ""){
86		//no image
87		return;
88	}
89	
90	var title = currentItem.find(".preview-title");
91	var subtitle = currentItem.find(".preview-subtitle");
92	
93	var currentHolder = currentItem.closest(".item-box");
94	var itemSiblings = currentHolder.siblings(".sub.item-box").not(":has([data-menu-name='PREVIEW_RAW'])");
95	if (itemSiblings.length > 0){
96		itemSiblings = itemSiblings.add(currentHolder);
97	}
98	var lightboxWrapper = $(".light-box-wrapper");
99	var closeBtn = lightboxWrapper.find(".close-lightbox-btn");
100	closeBtn.unbind("click").bind("click",function(e){
101		e.stopPropagation();
102		//remove the video before closing
103		$(".light-box-wrapper").find("iframe").remove();
104		$(".light-box-wrapper").hide();
105	});
106	var stripe = currentHolder.closest(".master.item-box");
107	var downloadBtn = lightboxWrapper.find(".download-gallery-btn");
108	if (stripe.find(".container").attr("data-allow-download") == "true"){
109		downloadBtn.show();
110		downloadBtn.unbind("click").bind("click",function(e){
111			e.stopPropagation();
112			location.href = XPRSHelper.getStaticServerPath() + "/download_gallery?vbid=" + stripe.attr("id");
113		});
114	}else{
115		downloadBtn.hide();
116	}
117	
118	//Close lightbox when clicking outside the image
119	lightboxWrapper.unbind("click").bind("click",function(e){
120			e.stopPropagation();
121			//remove the video before closing
122			$(".light-box-wrapper").find("iframe").remove();
123			$(".light-box-wrapper").hide();
124	});
125	
126	
127	var lightboxImageHolder = lightboxWrapper.find(".light-box-image-holder");
128	var lightboxImage = lightboxImageHolder.find(".light-box-image");
129	
130	//Catch the click (do not close when clicking on the image
131	lightboxImage.unbind("click").bind("click",function(e){
132		e.stopPropagation();
133	});
134	
135	var textWrapper = lightboxWrapper.find(".lightbox-text-wrapper");
136	var textHolder = textWrapper.find(".lightbox-text-holder");
137	var titleHolder = textWrapper.find(".lightbox-title").text(title.text());
138	var subtitleHolder = textWrapper.find(".lightbox-subtitle").text(subtitle.text());
139	var imageOrigHeight = currentItem.attr("data-orig-thumb-height");
140	var imageOrigWidth = currentItem.attr("data-orig-thumb-width");
141	var newWidth = parseInt(imageOrigWidth);
142	if (isNaN(newWidth)){
143		newWidth = 1600;
144	}else{
145		newWidth = Math.min(parseInt(imageOrigWidth),1600)
146	}
147	var imageId = currentItem.attr("data-vbid");
148	lightboxImage.find("iframe").remove();
149	if (videoSrc != ""){
150		lightboxImage.attr("data-videosrc",videoSrc);
151		var videoIframe = $("<iframe />").css({"width":"100%","height":"100%","border":"none"}).attr("src",videoSrc);
152		lightboxImage.append(videoIframe);
153		lightboxImage.css("background-image","");
154	}else{
155		if(!currentHolder.closest(".master.item-box").is(".showing-feed")){
156			lightboxImage.css("background-image","url('"+ imageSrc + "=s" + newWidth +"')");
157		}else{
158			lightboxImage.css("background-image","url('"+ imageSrc + "')");
159		}
160		lightboxImage.attr("data-orig-thumb-height",imageOrigHeight);
161		lightboxImage.attr("data-orig-thumb-width",imageOrigWidth);
162	}
163	
164	//lightboxImage.attr("data-orig-thumb-height",imageOrigHeight);
165	//lightboxImage.attr("data-orig-thumb-width",imageOrigWidth);
166	
167	lightboxImage.attr("data-vbid",imageId);
168	//titleHolder.css({"color":title.css("color"),"text-shadow":title.css("text-shadow"),"font-family":title.css("font-family")});
169	//subtitleHolder.css({"color":subtitle.css("color"),"text-shadow":subtitle.css("text-shadow"),"font-family":subtitle.css("font-family")});
170	titleHolder.css({"font-family":title.css("font-family"),"text-align":title.css("text-align")});
171	if (title.css("text-align") == "center"){
172		titleHolder.css({"margin-left":"auto","margin-right":"auto"});
173	}else if (title.css("text-align") == "right"){
174		titleHolder.css({"margin-left":"auto","margin-right":""});
175	}else{
176		titleHolder.css({"margin-left":"","margin-right":""});
177	}
178	subtitleHolder.css({"font-family":subtitle.css("font-family"),"text-align":subtitle.css("text-align")});
179	if (subtitle.css("text-align") == "center"){
180		subtitle.css({"margin-left":"auto","margin-right":"auto"});
181	}else if (subtitle.css("text-align") == "right"){
182		subtitle.css({"margin-left":"auto","margin-right":""});
183	}else{
184		subtitle.css({"margin-left":"","margin-right":""});
185	}
186	lightboxWrapper.show();
187	setTimeout(function(){
188		XPRSHelper.onCssTransitionFinish(lightboxImage,function(){
189			textHolder.css("opacity","1");
190			closeBtn.css("opacity","1");
191			LightBox.arrange();
192		});
193		
194	},0);
195	LightBox.addPagination(textHolder,lightboxWrapper,itemSiblings);
196};
197
198LightBox.arrange = function(){
199	var lightboxWrapper = $(".light-box-wrapper");
200	var offset = (typeof window["EditorHelper"] == "undefined") ? 0 : 50;
201	if (lightboxWrapper.is(":visible")){
202		var lightboxImageHolder = lightboxWrapper.find(".light-box-image-holder");
203		var lightboxImage = lightboxImageHolder.find(".light-box-image");
204		var lightboxTextWrapper = lightboxWrapper.find(".lightbox-text-wrapper");
205		var deviceWidth = $(".main-page").width();
206		var deviceHeight = Math.min($(window).height(),$(".main-page").height()) - offset;//$(".main-page").height() - lightboxTextWrapper.height();
207
208		var borderWidth = deviceWidth* 0.1;
209		var borderHeight = deviceHeight* 0.2;

210		var imageOrigHeight = lightboxImage.attr("data-orig-thumb-height");
211		var imageOrigWidth = lightboxImage.attr("data-orig-thumb-width");
212		lightboxImage.css({"width":deviceWidth - borderWidth,"height":deviceHeight - borderHeight,"max-width":imageOrigWidth + "px","max-height":imageOrigHeight+ "px"});
213	}
214};
215
216LightBox.addPagination = function(paginatorHolder,wrapper,items){
217	var paginator = wrapper.find("#paginator");
218	paginator.empty();
219	var lightboxWrapper = $(".light-box-wrapper");
220	var lightboxImageHolder = lightboxWrapper.find(".light-box-image-holder");
221	var lightboxImage = lightboxImageHolder.find(".light-box-image");
222	items.each(function(){
223		var currentHolder = $(this);
224		var currentItem = currentHolder.find(".item-content");
225		
226		var videoSrc = "";
227		var videoFrame = currentItem.find(".video-frame");
228		if (videoFrame.length > 0){
229			//var videoFrame = currentItem.find(".video-frame");
230			if (videoFrame.length > 0){
231				videoSrc = videoFrame.attr("src");
232			}else{
233				return;
234			}
235		}
236		var imageOrigHeight = currentItem.attr("data-orig-thumb-height");
237		var imageOrigWidth = currentItem.attr("data-orig-thumb-width");
238		var newWidth = parseInt(imageOrigWidth);
239		if (isNaN(parseInt(newWidth))){
240			newWidth = 1600;
241		}else{
242			newWidth = Math.min(parseInt(imageOrigWidth),1600)
243		}
244		var imageSrc = currentItem.attr("data-bgimg");
245		
246		if (imageSrc == ""){
247			return;
248		}else if(!currentHolder.closest(".master.item-box").is(".showing-feed")){
249			imageSrc += "=s" + newWidth;
250		}
251		var imageId = currentItem.attr("data-vbid");
252		var title = currentItem.find(".preview-title").text();
253		var subtitle = currentItem.find(".preview-subtitle").text();
254		var pageNavigator = $("<div />").addClass("page-navigator");
255		if (videoSrc != ""){
256			pageNavigator.attr("data-videosrc",videoSrc);
257		}else{
258			pageNavigator.attr("data-bgimg",imageSrc);
259			pageNavigator.attr("data-orig-thumb-height",imageOrigHeight);
260			pageNavigator.attr("data-orig-thumb-width",imageOrigWidth);
261		}
262		pageNavigator.attr("data-title",title);
263		pageNavigator.attr("data-subtitle",subtitle);
264		pageNavigator.attr("data-vbid",imageId);
265		
266		
267		pageNavigator.unbind("click").bind("click",function(){
268			var currentPaginator = $(this);
269			lightboxImage.find("iframe").remove();
270			if (currentPaginator.attr("data-videosrc")){
271				var videoIframe = $("<iframe />").css({"width":"100%","height":"100%","border":"none"}).attr("src",currentPaginator.attr("data-videosrc"));
272				lightboxImage.append(videoIframe);
273				lightboxImage.css("background-image","");
274			}else{
275				lightboxImage.css("background-image","url('"+ currentPaginator.attr("data-bgimg") +"')");
276				lightboxImage.attr("data-orig-thumb-height",imageOrigHeight);
277				lightboxImage.attr("data-orig-thumb-width",imageOrigWidth);
278			}
279			
280			
281			lightboxImage.attr("data-vbid",imageId);
282			wrapper.find(".lightbox-title").text(currentPaginator.attr("data-title"));
283			wrapper.find(".lightbox-subtitle").text(currentPaginator.attr("data-subtitle"));
284			setTimeout(function(){
285				LightBox.arrange();
286			},0);
287		});
288		paginator.append(pageNavigator);
289	});
290	
291	if (items.length > 1){
292		lightboxWrapper.find(".lightbox-arrow").show();
293		lightboxWrapper.find(".lightbox-arrow").unbind("click").bind("click",function(e){
294			e.stopPropagation();
295			lightboxImage.find("iframe").remove();
296			var currentShownId = lightboxImage.attr("data-vbid");
297			var relevantPaginationHolder = paginator.find(".page-navigator[data-vbid='"+ currentShownId +"']");
298			var currentPaginator = relevantPaginationHolder.next();
299			if ($(this).hasClass("lightbox-left")){
300				currentPaginator = relevantPaginationHolder.prev();
301			}
302			if (currentPaginator.length == 0){
303				currentPaginator = relevantPaginationHolder.siblings().first(); 
304				if ($(this).hasClass("lightbox-left")){
305					currentPaginator = relevantPaginationHolder.siblings().last(); 
306				}
307			}
308			if (currentPaginator.attr("data-videosrc")){
309				var videoIframe = $("<iframe />").css({"width":"100%","height":"100%","border":"none"}).attr("src",currentPaginator.attr("data-videosrc"));
310				lightboxImage.append(videoIframe);
311				lightboxImage.css("background-image","");
312			}else{
313				lightboxImage.css("background-image","url('"+ currentPaginator.attr("data-bgimg") +"')");
314				lightboxImage.attr("data-orig-thumb-height",currentPaginator.attr("data-orig-thumb-height"));
315				lightboxImage.attr("data-orig-thumb-width",currentPaginator.attr("data-orig-thumb-width"));
316			}
317			lightboxImage.attr("data-vbid",currentPaginator.attr("data-vbid"));
318			wrapper.find(".lightbox-title").text(currentPaginator.attr("data-title"));
319			wrapper.find(".lightbox-subtitle").text(currentPaginator.attr("data-subtitle"));
320			setTimeout(function(){
321				LightBox.arrange();
322			},0);
323			
324		});
325
326		lightboxWrapper.unbind("swipeleft").bind("swipeleft",function(){
327			LightBox.changePic("left");
328		});
329		
330		lightboxWrapper.unbind("swiperight").bind("swiperight",function(){
331			LightBox.changePic("right");
332		});
333

334		lightboxWrapper.unbind("keyup").bind("keyup", function(e){
335			if(e.keyCode == 37) { // left
336				LightBox.changePic("left");
337			  }
338			  else if(e.keyCode == 39) { // right
339				LightBox.changePic("right");
340			  }else if (e.keyCode === 27){
341				lightboxWrapper.find("iframe").remove();
342				lightboxWrapper.hide();
343			  }
344		});
345
346		lightboxWrapper.focus();
347
348
349	}else{
350		lightboxWrapper.find(".lightbox-arrow").hide();
351	}
352};
353
354LightBox.changePic = function(dir){
355	var lightboxWrapper = $(".light-box-wrapper");
356	var lightboxImageHolder = lightboxWrapper.find(".light-box-image-holder");
357	var lightboxImage = lightboxImageHolder.find(".light-box-image");
358	var paginator = lightboxWrapper.find("#paginator");
359
360
361	lightboxImage.find("iframe").remove();
362	var currentShownId = lightboxImage.attr("data-vbid");
363	var relevantPaginationHolder = paginator.find(".page-navigator[data-vbid='"+ currentShownId +"']");
364	var currentPaginator = relevantPaginationHolder.next();
365	if (dir == "left"){
366		currentPaginator = relevantPaginationHolder.prev();
367	}
368	if (currentPaginator.length == 0){
369		currentPaginator = relevantPaginationHolder.siblings().first(); 
370		if (dir == "left"){
371			currentPaginator = relevantPaginationHolder.siblings().last(); 
372		}
373	}
374	if (currentPaginator.attr("data-videosrc")){
375		var videoIframe = $("<iframe />").css({"width":"100%","height":"100%","border":"none"}).attr("src",currentPaginator.attr("data-videosrc"));
376		lightboxImage.append(videoIframe);
377		lightboxImage.css("background-image","");
378	}else{
379		lightboxImage.css("background-image","url('"+ currentPaginator.attr("data-bgimg") +"')");
380		lightboxImage.attr("data-orig-thumb-height",currentPaginator.attr("data-orig-thumb-height"));
381		lightboxImage.attr("data-orig-thumb-width",currentPaginator.attr("data-orig-thumb-width"));
382	}
383	lightboxImage.attr("data-vbid",currentPaginator.attr("data-vbid"));
384	lightboxWrapper.find(".lightbox-title").text(currentPaginator.attr("data-title"));
385	lightboxWrapper.find(".lightbox-subtitle").text(currentPaginator.attr("data-subtitle"));
386	setTimeout(function(){
387		LightBox.arrange();
388	},0);
389}
390
391
392
393
394
395