https://www.habsburger.net/files/js/js_LsdK8qUos4PV6HHGaOkMwQk9lvzV2AhPd8uN1N54tH0.js

1"use strict";
2
3!function($) {
4	var timeslider;
5	var tw = 0;
6	var scrollerIntv;
7	var w = 0,cw = 0;
8	var settingsTimeout;
9	var scrollSlider = false;
10	var staticPeriods;
11	var periods = new Array();
12	var SERVER = "";////static.habsburger.net";
13	
14	var $content,
15	$container,
16	$range,
17	$timeline;
18	var objects = new Array();
19	var prevX = 0;
20
21	$(document).ready(function(){
22		$timeline = $("#timeline");
23		if(!$timeline.length) return;
24		
25		$container = $("#timeline-container");
26		$range = $("#nav-timeline-range");
27		$content = $("#timeline-content");
28		
29
30		var	createLegend = function() {
31			var data = $(".field-legende .field-collection-item-field-legende");
32			data.find(".field-label").remove();
33			var $legende = $("<div id='timeline-legend'></div>");
34			$timeline.prepend($legende);
35			for(var i=0;i<data.length;i++) {
36				var text = $(data[i]).find(".field-begriff").text();
37				var pos = $(data[i]).find(".field-wert").text();
38				
39				pos = parseInt(pos);
40				pos -= 62
41				if(i == 0) {
42					pos += 56; 
43					continue;
44				} else if(i>0 && i < data.length-3) {
45					pos += 20;
46				} else {
47					pos += 2;
48				}
49				if(i == data.length-3) {
50					pos += 4;
51				}
52				var item = $("<div class='legende-item'>"+text+"</div>");
53				
54				if(i < data.length-3) {
55					item.css("top",pos);
56				} else {
57					item.css("top","auto");
58					item.css("bottom",32*(data.length-i));
59				}
60				$legende.append(item);
61				//if(i < 2) item.hide();
62			}
63			//console.log("legend")
64			$(".node").append($(".interfacebody"));
65			$(".interfacebody").addClass("fade in");
66			
67		}
68		
69		
70		var initInterface = function() {
71			
72			createLegend();
73			
74			var min = startYear;
75			var max = endYear;
76			var scale = window.innerWidth > 600 ? 15 : 10;
77		   if($timeline.length) {
78			  $(window).on("resize",function(){
79			  	w = $content.width();
80			  	cw = $container.width();
81			  })
82			  w = (max-min)*scale;
83			  $content.width(w);
84			  cw = $container.width();
85			  
86			  for(var i=min;i<max;i+=25) {
87			  		var display = i%50 == 0;
88					var item = $('<div class="year'+(display ? " century" :"")+'"><div class="yearline"></div><span class="yeartext">'+i+'</span></div>');
89					item.css("left",(i-min)*scale+"px");
90					$content.prepend(item);
91			   }
92			   
93			   // // //$("#timeline-ruler").show();
94			   // $(document).bind('mousewheel', function(event, delta, deltaX, deltaY) {
95			   // 		if(Math.abs(deltaY) > Math.abs(deltaX)) {
96			   // 			var $ci = $container;
97			   // 			var k = $ci.scrollLeft()-deltaY*20;
98	    	// 			$ci.scrollLeft(k)
99	    	// 			event.preventDefault();
100			   // 			event.stopPropagation();
101			   // 		}
102			   // });
103			   
104			   $container.on("scroll",function(e) {
105					var ls = Math.floor($container.scrollLeft());
106					var year = Math.floor(((ls+cw/2)/w)*(allYears)+startYear);
107					var yearsVisible = (cw/w*allYears)
108					yearFrom = Math.floor(year - yearsVisible/2)
109					yearTo = Math.floor(year + yearsVisible/2)
110					//console.log("update header")
111					updateTimelineHeader()
112					clearTimeout(settingsTimeout);
113					settingsTimeout = setTimeout("setSettings()",500);
114					
115					e.preventDefault();
116			   })
117
118			 		   
119			   $content.on("mousedown",function(e) {
120						var clickX = e.pageX;
121						if($(e.target).hasClass("label") || $(e.target).hasClass("object")) return;
122						var offX = $content.offset().left;
123						var mouseisdown = true;
124
125						var leftScroll = $container.scrollLeft();
126						$(document).off("mousemove");
127						$(document).on("mousemove",function(e){
128							var ls =leftScroll+(clickX-e.pageX)*2;
129							$container.scrollLeft(ls);
130							e.preventDefault();
131						});
132						$(document).off("mouseup");
133						$(document).on("mouseup",function(){
134							$(document).off("mousemove");
135							$(document).off("mouseup");
136							var ls = $container.scrollLeft();
137							if(mouseisdown) {
138								mouseisdown = false;
139								$content.removeClass("hover");
140							}
141							e.preventDefault();
142						});
143						e.preventDefault();
144					   
145				});
146			   
147			  
148				var h = $timeline.height();
149				
150
151				var erasLoadedFunc = function(){
152					var xx = 0;
153					for(var i=0;i<ERAS.length;i++) {
154						var era = ERAS[i];
155						var title = era["title"];
156						var path = era["path"];
157						var range = era["field_estimated_date_range"];
158						var d = era.dates;//calculateDates(range);
159						if(i==0) d[1] = startYear;
160						else if(i==ERAS.length-1) d[2] = 1950;
161						var obj = $("<div class='era era-"+(i+1)+"'></div>");
162						var bg = $("<div class='erabg'></div>");
163						bg.width("100%");
164						var tit = $("<div class='eratitle'></div>");
165						var titinner = $("<div class='eratitle-inner'></div>");
166						tit.append(titinner);
167						var years = $("<small>"+d[3]+"–"+d[4]+"</small>");
168						titinner.text(title);
169						titinner.append(years);
170						
171						obj.append(tit);
172						obj.prepend(bg);
173						
174						var from = d[1];
175						var to = d[2];
176						var left = ((from-startYear)/(1950-startYear))*100;			
177						var ew = Math.ceil(((to-from)/(1950-startYear))*w);
178						obj.width(ew+"px");
179						obj.css("left",xx+"px");
180						obj.css("z-index","0");

181						$content.prepend(obj);
182						xx += ew;
183					}
184				}
185				if(ERAS.length) {
186					erasLoadedFunc();
187				} else {
188					$(window).on("erasLoaded",erasLoadedFunc);
189				}
190
191				var lines = new Array(8,64,125,183,246)//,304);
192				for(var k=0;k<lines.length;k++) {
193					var line = $("<div class='category_line'></div>");
194					line.css("top",lines[k]+120);
195					//if((k-1)%2 && k< lines.length-1) line.css("height",lines[k+1]-lines[k]);
196					line.css("z-index",2);
197					$content.append(line);
198				}
199				$content.show();
200				var sc = Math.floor((yearFrom-startYear)/(allYears)*w);
201			 	$container.scrollLeft(sc);
202				loadPeriods();
203				loadAttrs();
204			}
205
206			window.render = function(){
207				var l = parseInt($range.css("left"));
208				var nrw = $range.width();
209				var nw = $("#nav-timeline").width();
210				var tw = $container.width();
211				var ls = (l)/(nw-nrw)*(allYears*scale-tw);
212				$container.scrollLeft(ls);
213
214			};		
215
216		};	   
217
218		var lang;
219		function loadPeriods() {
220			lang = LANGUAGE;
221			
222			var term = lang == "en" ? "periods" : "perioden";
223			term = "periods";
224			var $periods = $("#timeline-periods")
225			$.ajax({url:SERVER+"/"+lang+'/json/'+term+"/"+LANGUAGE,cache:true,success:function(data) {
226
227				
228				for(var i=0;i<data.nodes.length;i++) {
229					var node = data.nodes[i].node;
230					
231					var title = node["title"]
232					var img = node["teaser"];
233					
234					var type = node["type"]
235					
236					var range = node["field_estimated_date_range"];
237					
238					var tid = node["field_periodcategorie"];
239					
240					var m = calculateDates(range);
241					
242					var left = ((m[1]-startYear)/(1950-startYear));
243					var pw = ((m[2]-m[1])/(1950-startYear));
244					var obj = $("<div class='period' data-left='"+((left*w))+"'></div>");
245					left *= 1;
246					pw *=1;
247					obj.append($("<div class='period-label'><div class='period-title'>"+title+"</div><div class='arrow arrow-right'></div></div>"));
248					obj.css("left",Math.floor(left*w)+1);
249					obj.css("width",Math.floor(pw*w)-5);
250					var top = 24;
251					if(!tid) {
252						tid = type;
253					}
254					var starttop = -5;
255					switch(tid){
256						case "Wirtschaft":
257						case "Economy":
258							top = 4;
259							break;
260						case "Kunstgeschichte":
261						case "Art History":
262							top = 36;
263							break;
264						case "Gesellschaft":
265						case "Society":
266							top = 72;
267							break;
268						default:
269							top = 0;
270						
271					}
272					top += starttop;
273					obj.css("top",top);
274					//obj.attr("data",title);
275					//obj.attr("data-tooltip",1);
276					obj.css("z-index",zindex);
277					
278					zindex++;
279					$periods.append(obj);
280					periods.push({node:obj.find(".period-label").eq(0),from:m[1],to:m[2]})
281				}
282			}});
283		}
284
285
286		function loadAttrs() {
287				$.ajax({url:SERVER+'/json/attributes/'+LANGUAGE+"?v=2",cache:true,success:function(data) {
288					
289					for(var i=0;i<data.nodes.length;i++) {
290						var node = data.nodes[i].node;
291						
292						var title = node["title"]
293						var img = node["special"] || node["teaser"];
294						
295						var type = node["type"]
296						
297						var range = node["field_estimated_date_range"];
298						if(node["field_estimated_date"]) {
299							range = node["field_estimated_date"];
300						}
301						
302						var url = node["path"];
303						var nid = node["nid"];
304						var tid = node["field_person_category"];
305						
306						var m = calculateDates(range)[0];
307						
308						var left = Math.min(0.992,(m/(1950-startYear)));
309						
310						var top = 30;
311						if(!tid) {
312							tid = type;
313						}
314						var classes = "";
315						var starttop = 40;
316						switch(tid){
317							case "Habsburger Herrscher":
318								top = -12;
319								img = img.split("styles/interface").join("styles/timeline-herrscher");
320								img = img.split("interface/").join("special/");
321								img = img.split("_interface").join("_special");
322								classes += " herrscher";
323								break;
324							case "Habsburger":
325								//top = 90;
326								//break;
327							case "Person":
328							case "Herrscher":
329								top = 92///152;
330								break;
331							case "Ereignis":
332							case "Event":

333								top = 150//212;
334								break;
335							case "Objekt":
336							case "Object":
337								top = 210//272;
338								break;
339							case "Ort":
340							case "Schauplatz":
341							case "Location":
342								top = 270//334;
343								break;
344							default:
345								top = 210;
346							
347						}
348						top += starttop;
349						var $obj = $("<div class='object"+classes+"' data-src='"+img+"' data-left='"+((left*w))+"'></div>");
350						left *= 100;
351						$obj.append($("<div class='obj-title'>"+title+"</div>"));
352						$obj.css("left",left+"%");
353						
354						$obj.css("top",top);
355						$obj.attr("title",title);
356						$obj.attr("data-link",url);
357						$obj.attr("data-nid",nid);
358						$obj.overlay({nid:nid});
359						$obj.on("click",function(){
360							$(this).foundation("hide");
361						});
362						
363						$obj.on("touchstart mouseenter",function(){
364							var $this = $(this)
365							if($this.attr("data-tooltip")) {
366								if(!$this.hasClass("processed")) {
367									$this.foundation();
368									$this.addClass("processed");
369								}
370								$this.foundation("show");
371							}
372						})
373						
374						zindex++;
375						$obj.css("z-index",zindex);
376						$content.append($obj);
377						notloaded.push($obj);
378					}
379					$content.foundation();
380					loadimages();
381					loader = setInterval(function(){
382						loadimages()
383					},500);
384
385				}
386				
387			});
388		}
389			
390		
391		var staticPeriods = function(){
392			var plen = periods.length;
393			for(var i=0;i<plen;i++) {
394				var p = periods[i];
395				var node = p.node;
396				var b1 = p.from < yearFrom;//between(p.from,yearFrom,yearTo);
397				var b2 = false;//between(p.to,yearFrom,yearTo);
398				var b3 = p.from < yearFrom && p.to > yearTo;
399				
400				if(b1 || b2 || b3) {
401					if(b1 && b3) {
402						node.css("position","fixed");
403						node.css("left",230);
404						node.css("margin-top","-14px");
405					} else {
406						node.css("position","static");
407						node.css("left",'');
408						node.css("margin-top","");
409					}
410				} else {
411					node.css("position","static");
412					node.css("left",'');
413					node.css("margin-top","");
414				}
415			}
416		}
417
418			   
419
420		var loader;
421
422		var loadimages = function() {
423			var viewport_left = $container.scrollLeft()-200;
424			var viewport_right = $container.width()+viewport_left+200;
425
426			var tmp = new Array();
427			var nl = notloaded.length;
428			for(var i=0;i<nl;i++) {
429				var item = jQuery(notloaded[i]);
430				var visible = between(item.attr("data-left"),viewport_left,viewport_right);
431				if(visible) {
432					objects.push(item);
433					item.attr("data-tooltip",1);
434					var src = item.attr("data-src");
435					if(src) {
436						if(src.indexOf("//") == -1) src = SERVER+src;
437						if(SERVER) src = src.replace("admin.","static.").replace("www.","static.");
438					}
439					if(item.hasClass("herrscher")) {
440						var img = jQuery("<img src='"+src+"' />");
441						item.append(img);
442					} else {			
443						item.css("background-image","url("+src+")");
444					}
445				} else {
446					tmp.push(item);
447				}
448			}
449			notloaded = tmp;
450			if(notloaded.length == 0) {
451				clearInterval(loader);
452			}	
453		}
454		var notloaded = new Array();
455		var zindex = 0;
456		initInterface()
457	})
458} (window.jQuery);;