https://pension-gerlach.de/index_htm_files/simpleGallery_config.js

1var xaraSwidgets_simpleGalleryTemplates = {
2
3
4	entry:		'<a href="{image}" classname="highslide" onmouseover="hs2.headingText=\'\'" onclick="return hs2.expand(this, { slideshowGroup:\'{component_id}\' } )">'
5			+	'<span class="{component_id}imageBorder imageBorder">'
6			+	'<img src="{thumbnail}" border="0" />'
7			+	'</span>'
8			+	'</a>',
9			
10	main:		'<div id="{component_id}OuterDiv" class="">'
11			+ 	'<div id ="{component_id}InnerDiv" class="portfolio">'
12			+ 	'{entryhtml}'
13            + 	'</div>'
14            + 	'</div>'          
15            
16};
17
18var xaraSwidgets_simpleGalleryImagesDownloaded = {};
19var xaraSwidgets_simpleGalleryThumbnailsDownloaded = {};
20var xaraSwidgets_simpleGalleryThumbnailSize = 100;
21var xaraSwidgets_simpleGalleryOriginalWidth = 500;
22
23
24//var xaraSwidgets_simpleGalleryRows = 3;
25//var xaraSwidgets_simpleGalleryCols = 2;
26
27function xaraSwidgets_simpleGalleryOverallConstructor(divID, data, config)
28{
29	var useCols = config.cols ? config.cols : 3;
30	var padding = config.padding ? config.padding : 5;
31	var margin = config.margin ? config.margin : 3;
32	panelTrans = (data[0].trans);
33
34	xaraSwidgets_simpleGalleryCols = useCols;
35	xaraSwidgets_simpleGalleryOriginalPadding = padding;
36	xaraSwidgets_simpleGalleryOriginalMargin = margin;
37	
38	/*
39	if(xaraSwidgets_simpleGalleryCols==null)
40	{
41		xaraSwidgets_simpleGalleryCols = 2;
42	}
43	
44	if(xaraSwidgets_simpleGalleryOriginalPadding==null)
45	{
46		xaraSwidgets_simpleGalleryOriginalPadding = 5;
47	}
48	
49	if(xaraSwidgets_simpleGalleryOriginalMargin==null)
50	{
51		xaraSwidgets_simpleGalleryOriginalMargin = 3;
52	}
53	*/
54	
55	if ($.browser.msie)// && $.browser.version.substr(0,1)<7) {
56	{
57		var version = parseFloat($.browser.version);
58		
59		if(version<7)
60		{
61			$('#' + divID).html('you require Internet explorer 7 or greater to view this widget...');
62			return;
63		}
64		
65	}
66	
67	var fileFolder = 'index_htm_files';
68	
69	$('script').each(function() {
70		
71		var src = $(this).attr('src');
72		
73		if(src)
74		{
75			var parts = src.split('/');
76		
77			if(parts[1]=='simpleGallery_config.js')
78			{
79				fileFolder = parts[0];
80			}
81		}
82		
83	});
84	
85	//window.hs = window.simpleGalleryHighslide;
86	
87	window.hs2.outlineType=fileFolder + "/sgcustoms";
88	window.hs2.addSlideshow({slideshowGroup: divID, interval: 5000,repeat: true,useControls: true,fixedControls: 'fit',overlayOptions: {className: 'controls-in-heading',opacity: '0.75',position: 'bottom center',offsetX: '0',offsetY: '-10',hideOnMouseOut: true}});
89	
90	xaraSwidgets_simpleGalleryInit(divID, data);
91	
92}
93
94function xaraSwidgets_simpleGalleryGetScaledNumber(container, num, min)
95{
96	var widthRatio = container.width() / xaraSwidgets_simpleGalleryOriginalWidth;
97	
98	var newNum = Math.round(widthRatio * num);
99	
100	if(min==null) { min = 1; }
101	
102	if(newNum<=min) { newNum = min; }
103	
104	return newNum;
105}
106
107// this is the constructor for a component
108// it loops through each 'entry' in the array of data and compiles the entry template for it
109// it then applies the resulting HTML to the main template before writing the whole lot to the div on the page
110// it then initialises the actual jquery plugin for the div (that now contains the required HTML as a result of writing the template to it)
111function xaraSwidgets_simpleGalleryInit(divID, data)
112{
113	var imageSize = xaraSwidgets_simpleGalleryThumbnailSize;
114	
115	var container = $('#' + divID).parent();
116	
117	$('#' + divID).width(container.width()).height(container.height())
118	.css({
119		'overflow-y':'hidden',
120		'overflow-x':'hidden'
121	});
122	
123	var widthRatio = container.width() / xaraSwidgets_simpleGalleryOriginalWidth;
124	
125	var newPadding = xaraSwidgets_simpleGalleryGetScaledNumber(container, xaraSwidgets_simpleGalleryOriginalPadding);
126	var newMargin =  xaraSwidgets_simpleGalleryGetScaledNumber(container, xaraSwidgets_simpleGalleryOriginalMargin);
127	var newMarginBottom =  xaraSwidgets_simpleGalleryGetScaledNumber(container, 10);
128	var scrollbarWidth =  xaraSwidgets_simpleGalleryGetScaledNumber(container, 10, 4);
129	var shadow1 = xaraSwidgets_simpleGalleryGetScaledNumber(container, 4);
130	var shadow2 = xaraSwidgets_simpleGalleryGetScaledNumber(container, 9);
131	var shadow3 = xaraSwidgets_simpleGalleryGetScaledNumber(container, 4);
132	
133	if(scrollbarWidth>16)
134	{
135		scrollbarWidth = 16;	
136	}
137	
138	// get the opacity value for the panel
139		var enteredTrans = parseFloat(panelTrans);
140		var defaultTrans = '0.3';
141		var panelTrans = isNaN(enteredTrans) ? defaultTrans : enteredTrans
142		var iePanelTrans = panelTrans*100;
143
144	var shadowCSS = shadow1 + 'px ' + shadow1 + 'px ' + shadow2 + 'px 0px rgba(0,0,0,'+panelTrans+')';
145	
146	$('#' + divID).data('scrollbarWidth', scrollbarWidth);

147	
148	var tableWidth = container.width()-scrollbarWidth-2;
149	
150	$('#' + divID).data('tableWidth', tableWidth);
151	
152	var showShadows = true;
153	var dimPage = true;
154	
155	var currentCol = 0;
156	//width=' + tableWidth + '
157	var entryHTML = '<table class="imageTable" border=0 cellpadding=0 cellspacing=0><tr>';
158	// loop through each entry in the array and compile the entry template for it
159	for(var i=0; i<data.length; i++)
160	{
161		var entryData = data[i];
162		entryData.component_id = divID;
163		if(i==0)
164		{
165			if(!entryData.showshadow.match(/y/i))
166			{
167				showShadows = false;
168			}
169			
170			if(!entryData.dimpage.match(/y/i))
171			{
172				dimPage = false;
173			}
174		}
175		else
176		{
177			entryData.thumbnail = entryData.thumbnail;
178			
179			var cellHTML = xaraSwidgets_compileTemplate(xaraSwidgets_simpleGalleryTemplates.entry, entryData);
180			
181			entryHTML += '<td align=center valign=middle>' + cellHTML + '</td>';
182			
183			currentCol++;
184			
185			if(currentCol>=xaraSwidgets_simpleGalleryCols)
186			{
187				entryHTML += '</tr><tr>';
188				
189				currentCol = 0;
190			}
191		}
192	}
193	
194	if(!showShadows)
195	{
196		window.hs2.outlineType = null;
197	}
198	
199	if(!dimPage)
200	{
201		window.hs2.dimmingOpacity = 0;
202	}
203	
204	entryHTML += '</tr></table>';
205
206	
207

208	// now lets compile the 'main' template which acts as a wrapper for each entry
209	
210	var mainData = {
211		component_id:divID,
212		entryhtml:entryHTML
213	};
214	
215	var mainTemplate = xaraSwidgets_compileTemplate(xaraSwidgets_simpleGalleryTemplates.main, mainData);
216	
217	// now lets apply the resulting HTML for the whole component to the main DIV that was exported by XARA
218	
219	$('#' + divID).html(mainTemplate);
220	
221	/*
222	// now we have the components DOM on the page - we can use the 'OuterDiv' as the jquery initiation point
223	$('#' + divID + 'OuterDiv').find('#fancy').fancybox({
224		'transitionIn'	:	'elastic',
225		'transitionOut'	:	'elastic',
226		'easingIn'		:	'easeOutBack',
227		'easingOut'		:	'easeOutBack',
228		'speedIn'		:	400, 
229		'speedOut'		:	200,
230		'padding'		:	10,
231		'overlayOpacity'	: 	dimPage ? 0.3 : 0,
232		onStart: function()
233		{
234			if(!showShadows)
235			{
236				$('.fancybox-bg').hide();
237			}
238		}
239
240	});
241	*/
242	
243	newPadding -= 1;
244	
245	if($.browser.msie && document.documentMode && document.documentMode <= 7)
246	{
247		newMargin = 0;
248		newMarginBottom -= 2;
249	}
250	
251	$('#' + divID).find('.imageBorder').css({
252		'padding':newPadding + 'px',
253		'margin-bottom':newMarginBottom + 'px',
254		'margin-left':newMargin + 'px',
255		'margin-right':newMargin + 'px',
256		'-webkit-box-shadow': shadowCSS,
257		'-moz-box-shadow': shadowCSS,
258		'box-shadow': shadowCSS
259		/* For IE 8 */
260		//'-ms-filter': "progid:DXImageTransform.Microsoft.Shadow(Strength=" + shadow3 + ", Direction=135, Color='#cccccc')"
261
262		/* For IE 5.5 - 7 */
263//		'filter': "progid:DXImageTransform.Microsoft.Shadow(Strength=" + shadow3 + ", Direction=135, Color='#000000')"
264//		'filter': "progid:DXImageTransform.Microsoft.dropshadow(OffX=2, OffY=2, Color='#80000000') "
265
266	}).resize(function() {
267	
268		checkScrollbars(divID);
269		
270	});
271
272	$('head').append("<style> body:last-child ."+divID+"imageBorder {filter: none;}" 
273	+ "."+divID+"imageBorder {filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=4, OffY=4, Color='#"+iePanelTrans+"000000') }"
274	+"</style>" );
275	
276	checkScrollbars(divID);
277	
278	//xaraSwidgets_simpleGalleryCheckScrolling(divID);
279}
280
281function checkScrollbars(divID)
282{
283	if($('#' + divID).data('doneScrolling')) { return; }
284		
285	if($('#' + divID).find('.portfolio').height()>$('#' + divID).height())
286	{

287		$('#' + divID).jScrollPane({showArrows: false});
288		$('#' + divID).data('foundScrolling', true);
289		
290		$('#' + divID).find('.jspVerticalBar').css({
291			'width':$('#' + divID).data('scrollbarWidth') + 'px'
292		});
293	}
294	
295	
296	 
297
298	//console.log($('#' + divID).data('tableWidth'));
299	
300	$('#' + divID).find('.imageTable').width($('#' + divID).data('tableWidth')-2);
301
302	
303}