https://tpa.org.au/theme/_blueprint/js/themes/tiles/ug-theme-tiles.js

1
2if(typeof g_ugFunctions != "undefined")
3	g_ugFunctions.registerTheme("tiles");
4else 
5	jQuery(document).ready(function(){g_ugFunctions.registerTheme("tiles")});
6
7
8/**
9 * Grid gallery theme
10 */
11function UGTheme_tiles(){
12
13	var t = this;
14	var g_gallery = new UniteGalleryMain(), g_objGallery, g_objects, g_objWrapper; 
15	var g_tiles = new UGTiles(), g_lightbox = new UGLightbox(), g_objPreloader, g_objTilesWrapper;
16	var g_functions = new UGFunctions(), g_objTileDesign = new UGTileDesign();
17	
18	var g_options = {
19			theme_enable_preloader: true,		//enable preloader circle
20			theme_preloading_height: 200,		//the height of the preloading div, it show before the gallery
21			theme_preloader_vertpos: 100,		//the vertical position of the preloader
22			theme_gallery_padding: 0,			//the horizontal padding of the gallery from the sides
23			theme_appearance_order: "normal",	//normal, shuffle, keep - the appearance order of the tiles. applying only to columns type
24			theme_auto_open:null				//auto open lightbox at start
25	};
26	
27	var g_defaults = {
28			gallery_width: "100%",
29            lightbox_type: 'compact',
30            slider_control_zoom: false
31	};
32	
33	//temp variables
34	var g_temp = {
35			showPreloader: false
36	};
37	
38	
39	/**
40	 * Init the theme
41	 */
42	function initTheme(gallery, customOptions){
43		
44		g_gallery = gallery;
45		
46		//set default options
47		g_options = jQuery.extend(g_options, g_defaults);
48		
49		//set custom options
50		g_options = jQuery.extend(g_options, customOptions);
51		
52		modifyOptions();
53		
54		//set gallery options
55		g_gallery.setOptions(g_options);
56		
57		g_gallery.setFreestyleMode();
58		
59		g_objects = gallery.getObjects();
60		
61		//get some objects for local use
62		g_objGallery = jQuery(gallery);		
63		g_objWrapper = g_objects.g_objWrapper;
64		
65		//init objects
66		g_tiles.init(gallery, g_options);
67		g_lightbox.init(gallery, g_options);
68		
69		g_objTileDesign = g_tiles.getObjTileDesign();
70
71		
72	}
73	
74	
75	/**
76	 * modift options
77	 */
78	function modifyOptions(){
79		
80		if(g_options.theme_enable_preloader == true)
81			g_temp.showPreloader = true;
82		
83		switch(g_options.theme_appearance_order){
84			default:
85			case "normal":
86			break;
87			case "shuffle":
88				g_gallery.shuffleItems();
89			break;
90			case "keep":
91				g_options.tiles_keep_order = true;
92			break;
93		}
94		
95	}
96
97	
98	/**
99	 * set gallery html elements
100	 */
101	function setHtml(){
102		
103		//add html elements
104		g_objWrapper.addClass("ug-theme-tiles");
105		
106		g_objWrapper.append("<div class='ug-tiles-wrapper' style='position:relative'></div>");
107		
108		//add preloader
109		if(g_temp.showPreloader == true){
110			g_objWrapper.append("<div class='ug-tiles-preloader ug-preloader-trans'></div>");
111			g_objPreloader = g_objWrapper.children(".ug-tiles-preloader");
112			g_objPreloader.fadeTo(0,0);
113		}
114		
115		g_objTilesWrapper = g_objWrapper.children(".ug-tiles-wrapper");
116		
117		//set padding
118		if(g_options.theme_gallery_padding)
119			g_objWrapper.css({
120				"padding-left":g_options.theme_gallery_padding+"px",
121				"padding-right":g_options.theme_gallery_padding+"px"
122			});
123		
124		g_tiles.setHtml(g_objTilesWrapper);
125		g_lightbox.putHtml();
126	}
127	
128	/**
129	 * actually run the theme
130	 */
131	function actualRun(){
132		
133		//set preloader mode
134		if(g_objPreloader){
135			g_objPreloader.fadeTo(0,1);
136			g_objWrapper.height(g_options.theme_preloading_height);
137			g_functions.placeElement(g_objPreloader, "center", g_options.theme_preloader_vertpos);
138		}
139		
140		initEvents();
141		
142		g_tiles.run();
143		g_lightbox.run();
144		
145	}
146
147	
148	/**
149	 * run the theme
150	 */
151	function runTheme(){
152		
153		setHtml();
154		
155		actualRun();
156		
157	}
158	
159	
160	
161	/**
162	 * init size of the thumbs panel
163	 */
164	function initThumbsPanel(){
165		
166		//set size:
167		var objGallerySize = g_gallery.getSize();
168			
169		if(g_temp.isVertical == false)			
170			g_objPanel.setWidth(objGallerySize.width);
171		else
172			g_objPanel.setHeight(objGallerySize.height);
173		
174		g_objPanel.run();
175	}
176	
177	
178	/**
179	 * on tile click - open lightbox
180	 */
181	function onTileClick(data, objTile){
182		
183		objTile = jQuery(objTile);		
184		
185		var objItem = g_objTileDesign.getItemByTile(objTile);
186		var index = objItem.index;		
187		
188		g_lightbox.open(index);
189	}
190	
191	
192	/**
193	 * before items request: hide items, show preloader
194	 */
195	function onBeforeReqestItems(){
196				
197		g_objTilesWrapper.hide();
198		
199		if(g_objPreloader){
200			g_objPreloader.show();
201		
202			var preloaderSize = g_functions.getElementSize(g_objPreloader);
203			var galleryHeight = preloaderSize.bottom + 30;
204			
205			g_objWrapper.height(galleryHeight);
206		}
207		
208	}
209
210	/**
211	 * open lightbox at start if needed
212	 */
213	function onLightboxInit(){
214
215		if(g_options.theme_auto_open !== null){
216			g_lightbox.open(g_options.theme_auto_open);
217			g_options.theme_auto_open = null;
218		}
219		
220	}
221	
222	
223	/**
224	 * init buttons functionality and events
225	 */
226	function initEvents(){
227		
228		//remove preloader on tiles first placed
229		if(g_objPreloader){
230			
231			g_gallery.onEvent(g_tiles.events.TILES_FIRST_PLACED, function(){
232				
233				g_objWrapper.height("auto");
234				g_objPreloader.hide();
235			});			
236		}
237		
238		jQuery(g_objTileDesign).on(g_objTileDesign.events.TILE_CLICK, onTileClick);
239		
240		g_objGallery.on(g_gallery.events.GALLERY_BEFORE_REQUEST_ITEMS, onBeforeReqestItems);
241
242		jQuery(g_lightbox).on(g_lightbox.events.LIGHTBOX_INIT, onLightboxInit);
243
244	}
245	
246	
247	/**
248	 * destroy the theme
249	 */
250	this.destroy = function(){
251				
252		jQuery(g_objTileDesign).off(g_objTileDesign.events.TILE_CLICK);
253		
254		g_gallery.destroyEvent(g_tiles.events.TILES_FIRST_PLACED);
255				
256		g_objGallery.off(g_gallery.events.GALLERY_BEFORE_REQUEST_ITEMS);
257
258		jQuery(g_lightbox).off(g_lightbox.events.LIGHTBOX_INIT);
259		
260		g_tiles.destroy();
261		g_lightbox.destroy();
262	}
263	
264	
265	/**
266	 * run the theme setting
267	 */
268	this.run = function(){
269		
270		runTheme();
271	}
272	
273	
274	/**
275	 * add items
276	 */
277	this.addItems = function(){
278		
279		g_tiles.runNewItems();
280	}
281	
282	
283	/**
284	 * init 
285	 */
286	this.init = function(gallery, customOptions){
287				
288		initTheme(gallery, customOptions);
289		
290	}
291	
292	
293}