"
});
}
}
},
itemChanged: function($super, event, link) {
this.content.select('p.error').invoke("remove");
$(this.ancestor.identify()+'-l2').value = this.defaultDate;
$(this.ancestor.identify()+'-l1').value = this.defaultDate;
$super(event, link);
}
});
var Pager = Class.create({
initialize: function(elm, params) {
lg("start initializing Pager");
params = params || {};
this.element = elm;
this.entries = this.element.select("li");
this.next = this.element.down('.next');
this.prev = this.element.down('.prev');
this.showCount = params.showCount || 2;
this.pageCount = this.entries.eachSlice(this.showCount).length;
this.activePage = 1;
if (this.element.down("li.active")) {
this.activePage = Math.ceil((this.element.down("li.active").previousSiblings().length+1) / this.showCount);
}
this.pagenum = this.element.down('.pagenum');
this.createPaging();
// initialen Inhalt anzeigen
this.showPage(this.activePage);
this.next.observe("click", this.showNext.bindAsEventListener(this));
this.prev.observe("click", this.showPrev.bindAsEventListener(this));
lg("end initializing Pager");
},
createPaging: function() {
lg("createPaging");
// wenn mehr als eine Seite vorhanden ist, müssen die Statuspunkte generiert und
// mit der Klickmechanik versehen werden
if (this.pageCount > 1) {
var dot;
for (i = 0; i < this.pageCount; i++) {
this.pagenum.insert(dot = new Element("div", {
className: "dot"
}));
dot.observe("click", this.showPage.bind(this, i + 1));
}
var width = ((this.pageCount) * this.pagenum.down('.dot').getWidth()) || this.pageCount * 9;
this.pagenum.setStyle({
width: width + "px"
});
} else {
this.next.hide();
this.prev.hide();
}
},
showNext: function(event) {
event.stop();
lg("showNext");
if (this.activePage < this.pageCount) {
this.showPage(this.activePage+1);
} else {
this.showPage(1);
}
},
showPrev: function(event) {
event.stop();
lg("showPrev");
if (this.activePage > 1) {
this.showPage(this.activePage-1);
} else {
this.showPage(this.pageCount);
}
},
showPage: function(page) {
lg("showPage("+page+")");
this.activePage = page;
// verstecke nicht benötigte und zeige geforderte Seiten
this.entries.eachSlice(this.showCount).each(function(group, index) {
if (page != index+1 ) {
group.invoke("hide");
} else {
group.invoke("show");
}
});
// CSS noch anpassen an neuen internen Status
if (this.pagenum.down('.active'))
this.pagenum.down('.active').removeClassName("active");
this.pagenum.select('div')[page-1].addClassName("active");
}
});
// erbt das meiste von Pager, nur initialize() und showPage() muessen ueberschrieben werden
var Feedpager = Class.create(Pager, {
initialize: function($super, elm, params) {
//$super(elm, params);
lg("start initializing Feedpager");
params = params || {};
this.element = elm;
this.entries = this.element.select("li");
this.next = this.element.down('.next');
this.prev = this.element.down('.prev');
this.activePage = 1;
this.next.observe("click", this.showNext.bindAsEventListener(this));
this.prev.observe("click", this.showPrev.bindAsEventListener(this));
// groups speichert die anzahl der jeweiligen posts pro seite,
// also z.B. [1, 2, 1, 1, 2]
this.groups = [];
var classPrefix = "news-1of";
var elmcount;
for (var i = 0; i < this.entries.length;) {
// hol dir die Klassennamen des Listenelements und die Position
// unserer Spezialklasse, die wir in classPrefix zwischengespeichert haben
var classes = this.entries[i].classNames().toString();
var pos = this.entries[i].classNames().toString().indexOf(classPrefix);
// wenn wir einen validen Klassennamen haben, zieh dir die Anzahl
// der Elemente in der Gruppe aus dem Namen
if (pos > -1) {
elmcount = classes.substr(pos + classPrefix.length, 1);
elmcount = parseInt(elmcount);
}
// ist der Klassenname versehentlicherweise nicht korrekt,
// setze den elmcount-Wert auf ganz hoch, was zu einem eleganten
// Abbruch fuehrt
else {
elmcount = this.entries.length+1;
}
// falls versehentlich dem letzten element der newsliste die falsche
// klasse (z.B. 1of2) mitgegeben wurde, obwohl es alleine ist
if (i+elmcount >= this.entries.length ) {
elmcount = this.entries.length - i;
}
// fuege die anzahl der posts auf dieser seite den groups hinzu
this.groups.push(elmcount);
this.entries[i].addClassName("nodivider");
// erhoehe die schleifenvariable um den wert der posts, um erst bei den
// elementen der naechsten seite weiterzumachen und keine doppelt zu zaehlen
i += elmcount;
}
this.pageCount = this.groups.length;
this.pagenum = this.element.down('.pagenum');
this.createPaging();
// initialen Inhalt anzeigen
this.showPage(this.activePage);
lg("end initializing Feedpager");
},
showPage: function(page) {
lg("showPage("+page+")");
this.activePage = page;
// CSS der Paging-Punkte anpassen an neuen internen Status
if (this.pagenum.down('.active'))
this.pagenum.down('.active').removeClassName("active");
this.pagenum.select('div')[this.activePage-1].addClassName("active");
// verstecke nicht benötigte und zeige geforderte Seiten
var current = 0;
for (var i = 0; i < this.groups.length; i++) {
if (i == this.activePage-1) {
for (var j = 0; j < this.groups[i]; j++) {
if (this.entries.length >= current + j) {
this.entries[current + j].show();
// lg("show Feedentry:" + (current + j));
}
}
} else {
for (var j = 0; j < this.groups[i]; j++) {
if (this.entries.length >= current + j) {
this.entries[current + j].hide();
// lg("hide Feedentry:" + (current + j));
}
}
}
current += this.groups[i];
}
lg("end showPage");
}
});
var Expandable = Class.create({
initialize: function(elm, params) {
lg("start initialize Expandable");
this.handler = elm;
this.element = this.handler.up(".subelement");
this.content = this.element.down(".shadowcontent");
this.active = false;
this.height = this.content.getHeight();
this.element.identify(); // versieht das Element mit einer ID, falls noch keine vorhanden ist
if (this.element.up('.elementcontainer') && this.element.up('.elementcontainer').down('.secondaryopenhandler')) {
this.secondaryHandler = this.element.up('.elementcontainer').down('.secondaryopenhandler');
}
// content initial verstecken, falls nicht eingeblendet
if (this.content.readAttribute('aria-hidden')=='false') {
// eingeblendet
this.content.setStyle({
overflow:"hidden"
});
this.element.addClassName("active");
this.active = true;
this.handler.writeAttribute('aria-expanded', 'true');
} else {
// ausgeblendet
this.content.setStyle({
height:"0px",
overflow:"hidden",
display:"none"
});
this.element.removeClassName("active");
this.handler.writeAttribute('aria-expanded', 'false');
}
this.handler.writeAttribute('aria-controls', this.element.identify());
// öffnen-funktionalität
this.handler.observe("click", this.click.bindAsEventListener(this));
if (this.secondaryHandler) {
this.secondaryHandler.observe("click", this.clickSecondary.bindAsEventListener(this));
}
// listener definieren
document.observe("expandable-"+this.element.identify()+":toggle", this.click.bindAsEventListener(this));
document.observe("expandable-"+this.element.identify()+":open", this.open.bind(this));
document.observe("expandable-"+this.element.identify()+":close", this.close.bind(this));
document.observe("expandable-all:close", this.close.bind(this));
document.observe("expandable-"+this.element.identify()+":resize", this.resize.bind(this));
lg("finished initializing Expandable");
},
updateTitles: function(){
var from = this.active ? 'ausblenden' : 'anzeigen';
var to = this.active ? 'anzeigen' : 'ausblenden';
this.handler.writeAttribute('title', this.handler.readAttribute('title').split(from).join(to));
this.handler.update(this.handler.innerHTML.split(from).join(to));
if (this.secondaryHandler) {
this.secondaryHandler.writeAttribute('title', this.secondaryHandler.readAttribute('title').split(from).join(to));
}
},
click: function(event) {
lg("click");
event.stop();
// halte alle effekte an
Effect.Queues.get(this.element.identify()).each(function(effect) { effect.cancel(); });
if (this.active) {
this.updateTitles();
this.close();
}
else {
this.updateTitles();
this.open();
}
},
clickSecondary: function(event) {
lg("clickSecondary");
event.stop();
// halte alle effekte an
Effect.Queues.get(this.element.identify()).each(function(effect) { effect.cancel(); });
if (!this.active) {
this.updateTitles();
this.open();
}
},
open: function() {
if (!this.active) {
lg("start opening");
document.fire("expandable-all:close");
// vorbereiten der neuen höhe
this.content.setStyle({
display:"block",
height:"auto"
});
// hol die neue hoehe
this.height = this.content.getHeight();
this.content.setStyle({
height:"0px"
});
// versteck den hilfs-oeeffner
if (this.secondaryHandler) {
this.secondaryHandler.hide();
}
// morphe zu neuer Höhe
this.element.addClassName("active");
this.element.up(".elementcontainer").addClassName("active");
this.active = true;
new Effect.Morph(this.content, {
duration: 1,
style: "height:" + this.height + "px; padding-bottom:4px;",
afterFinish: this.endOpen.bind(this),
queue: {
scope: this.element.identify(),
limit: 1
}
});
}
},
close: function() {
if (this.active) {
lg("start closing");
this.element.removeClassName("active");
this.element.up(".elementcontainer").removeClassName("active");
this.active = false;
new Effect.Morph(this.content, {
duration: 1,
style: "height:0px; padding-bottom:0px;",
afterFinish: this.endClose.bind(this),
queue: {
scope: this.element.identify(),
limit: 1
}
});
}
},
// funktion, die von höhe 1 zu höhe 2 resized
resize: function() {
// cache alte höhe
var tempHeight = this.content.getHeight();
// hole neue höhe
this.content.setStyle({
height:"auto"
});
var newHeight = this.content.getHeight();
// setze wieder auf alte höhe
this.content.setStyle({
height:tempHeight+"px"
});
// morphe zu neuer höhe und feure den dazugehörigen event ab
new Effect.Morph(this.content, {
duration: 0.4,
style: "height:"+newHeight+"px;",
afterFinish: function() {
document.fire("expandable-"+this.element.identify()+":finishedResizing");
}.bind(this),
queue: {
scope: this.element.identify(),
limit: 1
}
});
},
endOpen: function() {
lg("end opening");
document.fire("expandable-"+this.element.identify()+":finishedOpening");
this.content.writeAttribute('aria-hidden', 'false');
this.handler.writeAttribute('aria-expanded', 'true');
},
endClose: function() {
lg("end closing");
// zeig den hilfs-oeeffner
if (this.secondaryHandler) {
this.secondaryHandler.show();
}
this.content.setStyle({
display:"none"
});
document.fire("expandable-"+this.element.identify()+":finishedClosing");
this.content.writeAttribute('aria-hidden', 'true');
this.handler.writeAttribute('aria-expanded', 'false');
}
});
/*
* Suchfunktionalitaeten
*/
function setSearchLocation(params) {
if ($('searchcontainer') && $('searchid') && $('searchlocation') && params && params.caption && params.value) {
$('searchid').update(params.caption);
$('searchlocation').writeAttribute({value: params.value});
// $('searchcontainer').removeClassName('active');
$$('#searchcontainer #scope a').invoke('removeClassName', 'active');
$(params.element).addClassName('active');
toggleSearchContainer();
return true;
} else {
return false;
}
}
boundSearchFunction = function(event){
if (!isInElement(Event.pointer(event), $('searchcontainer'))) {
toggleSearchContainer();
}
}
function toggleSearchContainer () {
if ($('searchcontainer').hasClassName('active')) {
document.stopObserving("click", boundSearchFunction);
$('searchid').writeAttribute("aria-expanded", "false");
$('scope').writeAttribute("aria-hidden", "true");
} else {
document.observe("click", boundSearchFunction);
$('searchid').writeAttribute("aria-expanded", "true");
$('scope').writeAttribute("aria-hidden", "false");
}
$('searchcontainer').toggleClassName('active');
}
var ChronikSlider = Class.create({
initialize: function(params){
this.build();
this.observePaging();
},
build: function() {
// falls es schon einen slider gibt, eventListener und slider selbst loeschen
if (this.slider && this.slider.options && this.slider.options.onChange) {
this.slider.options.onChange = null;
this.slider = null;
}
// hol dir die anzahl der jahre
this.valueElms = $('timelineslider').up().down(".timeline").childElements();
// berechne den pixel-abstand zwischen den jahren und positioniere die jahre
var width = Math.floor(($('timelineslider').getWidth() - this.valueElms[0].getWidth()) / (this.valueElms.length-1));
this.widthVals = [];
this.valueElms.each(function(li, index) {
li.setStyle({
left:Math.floor(index*width - li.getWidth()/2) + "px"
});
this.widthVals.push(Math.floor(index*width - li.getWidth()/2));
}.bind(this));
// wenn es noch kein aktuelles jahr gibt, hol es dir aus der timeline-beschriftung
if (!this.currentYear)
this.currentYear = parseInt(this.valueElms[0].up().down(".active").down().innerHTML);
// wenn es noch kein naechstes jahr gibt, hol es dir aus der timeline-beschriftung.
// wenn dort keins mehr ist (weil wir im letzten jahr des aktuellen timeframe sind),
// dann hol es dir aus der URL des von PHP generierten "Next"-Link
if (!this.nextYear) {
if (this.valueElms[0].up().down(".active").nextSiblings().length) {
this.nextYear = parseInt(this.valueElms[0].up().down(".active").nextSiblings()[0].down().innerHTML);
} else {
this.nextYear = $('timelinepaging').down('.next').href.toQueryParams()['year'] || 0;
}
}
// wenn es noch kein vorheriges jahr gibt, hol es dir aus der timeline-beschriftung.
// wenn dort keins mehr ist (weil wir im ersten jahr des aktuellen timeframe sind),
// dann hol es dir aus der URL des von PHP generierten "Prev"-Link
if (!this.prevYear) {
if (this.valueElms[0].up().down(".active").previousSiblings().length) {
this.prevYear = parseInt(this.valueElms[0].up().down(".active").previousSiblings()[0].down().innerHTML);
} else {
this.prevYear = $('timelinepaging').down('.prev').href.toQueryParams()['year'] || 0;
}
}
// wenn es noch keinen aktuellen timeframe gibt, hol ihn dir aus der zeitabschnitt-liste
// anhand der klasse des aktiven timeframes
if (typeof(this.timeframe) == "undefined") {
this.timeframe = $('timeframeselector').down('a.active').up('li').previousSiblings().length;
}
// erstelle den slider
this.slider = new Control.Slider('timelinehandler', 'timelineslider', {
minimum: 0,
maximum: $('timelineslider').getWidth(),
range: $R(0, this.widthVals[this.widthVals.length-1] + parseInt($('timelinehandler').getStyle("margin-left"))),
onChange: this.onChange.bindAsEventListener(this),
values: this.widthVals,
sliderValue: this.getPositionFromYear(this.currentYear)
});
},
observePaging: function() {
// belege den next-link mit einem eventListener
if ($('timelinepaging').down('.next')) {
$('timelinepaging').down('.next').observe("click", this.goToNextYear.bindAsEventListener(this));
}
// belege den prev-link mit einem eventListener
if ($('timelinepaging').down('.prev')) {
$('timelinepaging').down('.prev').observe("click", this.goToPrevYear.bindAsEventListener(this));
}
// belege die timeframe-links mit einem eventListener
$('timeframeselector').select('a').each(function(link, index){
link.observe("click", this.goToTimeframe.bindAsEventListener(this, index));
}.bind(this));
this.managePagingVisibility();
},
// managePagingVisibility sorgt dafuer, dass immer nur die next/previous-Links
// zu sehen sind, die auch Sinn machen und kuemmert sich um die korrekte
// auszeichnung des aktiven timeframes
managePagingVisibility: function() {
if (this.nextYear) {
$('timelinepaging').down('.next').show();
$('timelinepaging').down('.next').update("Weiter zu " + this.nextYear);
} else {
$('timelinepaging').down('.next').hide();
}
if (this.prevYear) {
$('timelinepaging').down('.prev').show();
$('timelinepaging').down('.prev').update("Zurück zu " + this.prevYear);
} else {
$('timelinepaging').down('.prev').hide();
}
$('timeframeselector').down("a.active").removeClassName("active");
$('timeframeselector').select("li")[this.timeframe].down("a").addClassName("active");
},
onChange: function(value) {
// wenn jemand am slider rumzieht, hol dir das neue jahr
if (this.valueElms[this.getIndexFromPosition(value)].down()) {
var year = this.valueElms[this.getIndexFromPosition(value)].down().innerHTML;
this.goToYear(year);
}
},
goToYear: function(year) {
// AJAX-request, wenn das jahr gewechselt wird (ueber slider oder prev/next-links)
new Ajax.Request('?', {
parameters: {
year: year,
lastYear: this.currentYear,
ajax: true
},
onSuccess: this.ajaxSuccess.bindAsEventListener(this)
});
},
goToTimeframe: function(event, timeframe) {
// AJAX-request, wenn der timeframe gewechselt wird
// (ueber klicks auf die timeframe-links)
event.stop();
this.timeframe = timeframe;
new Ajax.Request('?', {
parameters: {
timeframe: this.timeframe,
lastYear: this.currentYear,
ajax: true
},
onSuccess: this.ajaxSuccess.bindAsEventListener(this)
});
},
goToNextYear: function(event) {
event.stop();
this.goToYear(this.nextYear);
},
goToPrevYear: function(event) {
event.stop();
this.goToYear(this.prevYear);
},
getIndexFromPosition: function(pixels) {
var vindex;
this.widthVals.each(function(val, index) {
if (val == pixels) {
vindex = index;
}
});
return vindex;
},
getIndexFromYear: function(year) {
var vindex;
this.valueElms.each(function(elm, index) {
if (elm.down().innerHTML == year) {
vindex = index;
}
});
return vindex;
},
getPositionFromYear: function(year) {
var vposition;
this.widthVals.each(function(position, index) {
if (this.valueElms[index].down().innerHTML == year) {
vposition = position;
}
}.bind(this));
return vposition;
},
ajaxSuccess: function(request) {
// wird ausgefuehrt, wenn das mit dem AJAX-request geklappt hat
// setze die neue umgebung
this.timeframe = request.responseJSON.timeframe;
this.currentYear = request.responseJSON.currentYear;
this.nextYear = request.responseJSON.nextYear;
this.prevYear = request.responseJSON.prevYear;
if (request.responseJSON.type == "simple") {
// wenn es ein simpler request war (kein timeframe-wechsel)
$('yeardetails').update(request.responseJSON.response);
this.valueElms[this.getIndexFromYear(this.currentYear)].up().down(".active").removeClassName("active");
this.valueElms[this.getIndexFromYear(this.currentYear)].addClassName("active");
$('timelinehandler').setStyle({ left: this.getPositionFromYear(this.currentYear) + "px" });
} else if (request.responseJSON.type == "complex") {
// wenn es ein komplexer request war (neues jahr hat anderen timeframe als vorheriges)
$('timelinecontainer').update(request.responseJSON.timelinecontent);
this.build();
}
// aktualisiere noch die anzeige der prev/next/timeframe-links
this.managePagingVisibility();
}
});
/**
* Prueft, ob point innerhalb der Grenzen von elm liegt. Gibt true oder false zurueck.
* @param {x:integer, y:integer} point
* @param {Object} elm
* @return boolean true, wenn point innerhalb von elm liegt, sonst false
*/
function isInElement(point, elm) {
var x = point.x;
var y = point.y;
var elm = elm;
var dOffset = document.viewport.getScrollOffsets();
if ((x > elm.viewportOffset()[0]+elm.cumulativeScrollOffset()[0]+dOffset[0]+elm.getWidth() || x < elm.viewportOffset()[0]+elm.cumulativeScrollOffset()[0]+dOffset[0])
|| (y > elm.viewportOffset()[1]+elm.cumulativeScrollOffset()[1]+dOffset[1]+elm.getHeight() || y < elm.viewportOffset()[1]+elm.cumulativeScrollOffset()[1]+dOffset[1])) {
return false;
} else {
return true;
}
}
/**
* Prueft, ob der verwendete Browser Internet Explorer 6 oder aelter ist.
* @return boolean true, wenn User Agent IE6 oder aelter ist, sonst false
*/
function isIE6OrLess(){
var agt=navigator.userAgent.toLowerCase();
var is_major = parseInt(navigator.appVersion);
var is_minor = parseFloat(navigator.appVersion);
var is_ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1));
return (is_ie && (is_major == 4) && (agt.search(/msie [56]\./)!=-1) );
}
/**
* Stellt Debug-Messages für Firefox, IE8, Opera, Safari, Chrome (Konsole) und IE<8 (alert) zur Verfügung.
* @param string text
* @return void
*/
function lg(text) {
if (false)
{
if (typeof(opera) != "undefined" && opera != null) {
opera.postError(text);
return;
}
else
if (typeof(console) != "undefined" && console != null) {
console.log(text);
return;
}
// else {
// alert(text);
// }
}
}