function optimizeLayout () {
	var width = getWidth();
	var height = getHeight();
	if(width < 1200 || height < 850) {
		document.getElementById('layout-container').style.top = '0px';
		document.getElementById('layout-container').style.left = '0px';
		document.getElementById('layout-container').style.marginTop = '0px';
		document.getElementById('layout-container').style.marginLeft= '0px';
		document.getElementById('content-container').style.top = '0px';
		document.getElementById('content-container').style.left = '0px';
		document.getElementById('content-container').style.marginTop = '0px';
		document.getElementById('content-container').style.marginLeft= '0px';
		document.getElementById('clickable-container').style.top = '0px';
		document.getElementById('clickable-container').style.left = '0px';
		document.getElementById('clickable-container').style.marginTop = '0px';
		document.getElementById('clickable-container').style.marginLeft= '0px';
		document.getElementById('page_container').style.top = '20px';
		document.getElementById('page_container').style.marginTop = '0px';
		document.getElementById('page_container').style.left = '20%';
		document.getElementById('page_container').style.marginLeft = '0px';
		document.getElementById('page_calendar').style.top = '20px';
		document.getElementById('page_calendar').style.marginTop = '0px';
		document.getElementById('page_calendar').style.left = '20%';
		document.getElementById('page_calendar').style.marginLeft = '0px';	
		document.getElementById('page_bulletin').style.top = '20px';
		document.getElementById('page_bulletin').style.marginTop = '0px';
		document.getElementById('page_bulletin').style.left = '20%';
		document.getElementById('page_bulletin').style.marginLeft = '0px';
	} else {
		document.getElementById('layout-container').style.top = '50%';
		document.getElementById('layout-container').style.left = '50%';
		document.getElementById('layout-container').style.marginTop = '-425px';
		document.getElementById('layout-container').style.marginLeft= '-600px';
		document.getElementById('content-container').style.top = '50%';
		document.getElementById('content-container').style.left = '50%';
		document.getElementById('content-container').style.marginTop = '-425px';
		document.getElementById('content-container').style.marginLeft= '-600px';
		document.getElementById('clickable-container').style.top = '50%';
		document.getElementById('clickable-container').style.left = '50%';
		document.getElementById('clickable-container').style.marginTop = '-425px';
		document.getElementById('clickable-container').style.marginLeft= '-600px';
		document.getElementById('page_container').style.top = '50%';
		document.getElementById('page_container').style.marginTop = '-410px';
		document.getElementById('page_container').style.left = '50%';
		document.getElementById('page_container').style.marginLeft = '-300px';
		document.getElementById('page_calendar').style.top = '50%';
		document.getElementById('page_calendar').style.marginTop = '-410px';
		document.getElementById('page_calendar').style.left = '50%';
		document.getElementById('page_calendar').style.marginLeft = '-300px';
		document.getElementById('page_bulletin').style.top = '50%';
		document.getElementById('page_bulletin').style.marginTop = '-410px';
		document.getElementById('page_bulletin').style.left = '50%';
		document.getElementById('page_bulletin').style.marginLeft = '-300px';	
	}
}

function highlightClickable (node) {
	node.style.opacity = '0.2';
}
function unhighlightClickable (node) {
	node.style.opacity = '0.0';	
}
function showPage (target) {
	append = document.getElementById('append_closepage').innerHTML;
	document.getElementById('page_container').style.display = 'block';
	document.getElementById('background_fade').style.display = 'block';
	document.getElementById('page_container').innerHTML = document.getElementById('buffer_' + target).innerHTML + append;
	if(document.getElementById('buffer_' + target).style.backgroundColor != '') {
		document.getElementById('page_container').style.backgroundColor = document.getElementById('buffer_' + target).style.backgroundColor;
	} else {
		document.getElementById('page_container').style.backgroundColor = '#f8f4df';
	}
}
function hidePage () {
	document.getElementById('page_container').style.display = 'none';
	document.getElementById('background_fade').style.display = 'none';
}

function galleryPrev () {
	activePic--;
	if(activePic < 0)
		activePic = galleryPics.length - 1;
	document.getElementById('galerie').innerHTML = '<img src="' + galleryPics[activePic] + '" alt="">';	
}

function galleryNext () {
	activePic++;
	if(activePic == galleryPics.length)
		activePic = 0;
	document.getElementById('galerie').innerHTML = '<img src="' + galleryPics[activePic] + '" alt="">';	
}

function getWidth () {
  if (window.innerWidth) {
    return window.innerWidth;
  } else if (document.body && document.body.offsetWidth) {
    return document.body.offsetWidth;
  } else {
    return 0;
  }
}

function getHeight () {
  if (window.innerHeight) {
    return window.innerHeight;
  } else if (document.body && document.body.offsetHeight) {
    return document.body.offsetHeight;
  } else {
    return 0;
  }
}

function calRedirect(date, target) {
	document.getElementById('calendar').src = 'cal.php?date=' + date + '&target=' + target;
}
function showCalendar () {
	document.getElementById('page_calendar').style.display = 'block';
	document.getElementById('background_fade').style.display = 'block';
}
function hideCalendar () {
	document.getElementById('page_calendar').style.display = 'none';
	document.getElementById('background_fade').style.display = 'none';
}

function showBulletin () {
	document.getElementById('page_bulletin').style.display = 'block';
	document.getElementById('background_fade').style.display = 'block';
}
function hideBulletin () {
	document.getElementById('page_bulletin').style.display = 'none';
	document.getElementById('background_fade').style.display = 'none';
}
function bulletinPreview () {
	var name = document.getElementById('form_name').value;
	var post = document.getElementById('form_post').value;
	post = post.replace(/\n/g,"<br>");
	var html = '<div id="box"><div class="user"><span class="name">' + name +'</span> schrieb uns am '+ datum + '...</div><div class="post">'+ post +'</div></div>';
	document.getElementById('preview').innerHTML = html;
}