/**
 * Editmode
 *
 * show or hide the edit mode
 *
 * @version $Id: editmode.js,v 1.0 2009-02-06 a.kurfuerst Exp $
 * @author André Kurfürst <a.kurfuerst@ewerk.com>
 * @copyright Copyright (c) 2009 eWerk IT GmbH
 */

// onload no overlay
var overlay = false;

// layer over content
var overlayDiv = new Element('div', { 'id': 'overlay' });
// bubble with the content for the specific module
var overlayContent = new Element('div', { 'id': 'overlayContent', 'styles': {'display': 'none'}	});
// belongs to bubble (only backgroundimage inside)
var span = new Element('span', {'id': 'bubble'});

// set an array with all modules
var container = new Array(
				"text_show", 
				"text_showHeadline", 
				"teaser_show",
				"main-nav",
				"navigation_showPathNavigation",
				"short_navigation_show",
				"search2_showForm",
				"image_showGalleryImages",
				"image_show",
				"glossary_showGlossaryWidthIndex",
				"faq_showSlide",
				"faq_show",
				"download_show",
				"download_showSingle",
				"formgen_showForm_form_standard",
				"navigation_showLevel3"
			);

// set or reset vverlay
function toggleOverlay() {
	(overlay) ?  resetOverlay() : setOverlay();
}


/* 
	sets the overlay div
	sets the info icon links
*/
function setOverlay() 
{
	$('toggleOverlay').setStyles({'backgroundPosition': 'left -104px'});
	$$('body').addClass('overlay');
	
	height = $('page').getSize().y + $('infoheader').getSize().y
		
	if (document.documentElement.clientHeight) {
		if (document.documentElement.clientHeight > height ) {
			height = document.documentElement.clientHeight;
		}
	}
	else {
		if (window.innerHeight > height) {
			height = window.innerHeight
		}
	}
	
	overlayDiv.setStyle('height', height + 'px');
	
	
	$$('#toggleOverlay a').setStyle('color', "#666666")
	
	for (var i = 0; i < container.length; i++) {	
		var liste = $$('.' + container[i]);
		for (var j = 0; j < liste.length; j++) {	
			var div = new Element('div', {
				'class': 'overlay_border',
				'styles': {
        	'height': $(liste[j]).getSize().y + 'px',
        	'width': $(liste[j]).getSize().x + 'px',
					'left': $(liste[j]).getPosition().x,
					'top': $(liste[j]).getPosition().y
    		}
			});
			

			
			var a = new Element('a', {
					'href': '#',
					'html': 'Info'
				});

			a.id = i;
			a.onclick = function(){
				//hide/show overlay
				if (parseInt(overlayContent.style.left) == this.getPosition().x - 230 && parseInt(overlayContent.style.top) == this.getPosition().y) {
					overlayContent.setStyle('display', 'none');
					overlayContent.setStyle('left', 0);
					overlayContent.setStyle('top', 0);
				} else {
					overlayContent.setStyle('left', this.getPosition().x - 230 + "px");
					overlayContent.setStyle('top', this.getPosition().y + "px");
					overlayContent.innerHTML = content[container[this.id]];
					span.inject(overlayContent)
					overlayContent.setStyle('display', 'block');
				}
				return false;
      };

			div.inject(liste[j], 'top');
			a.inject(div, 'top');
		}
	}
	
	overlayDiv.inject(document.body, 'top');
	overlayContent.inject(document.body, 'top');
	
	overlay = true;
}


// reset and hide all used overlay-elements
function resetOverlay() {
	$('toggleOverlay').setStyles({'backgroundPosition': 'left top'}) 
	$$('.overlay_border').dispose();
	$$('body').removeClass('overlay');
	$('overlay').dispose();
	$$('#toggleOverlay a').setStyle('color', "#ffffff")
	overlayContent.setStyle('display', 'none');
	
	overlay = false;
}



/* content for the specific module */
var content = new Array()

content["text_show"] = "<h2>Textkatalog</h2>Die Funktion Texte dient der Anzeige im Backend angelegter Texte. Diese k&ouml;nnen mittels WYSIWYG-Editor formatiert werden. Auch das Einf&uuml;gen von Bildern, Tabellen, Links usw. in einem Text ist m&ouml;glich.";

content["text_showHeadline"] = "<h2>Text mit &Uuml;berschrift</h2>Die Funktion Texte dient der Anzeige im Backend angelegter Texte. Diese k&ouml;nnen mittels WYSIWYG-Editor formatiert werden. Falls, wie hier, im Design vorgesehen, kann auch die Text&uuml;berschrift gesondert angezeigt werden.";

content["teaser_show"] = "<h2>Modul Teaser</h2>Ein Teaser ist ein anklickbares Bild, welches aus einem Bild und einem Link besteht. Bei Bedarf kann dem Teaser auch eine kurze Beschreibung angeh&auml;ngt werden. Alles wird seperat im Backend verwaltet und im Teasermodul zusammengef&uuml;gt. Das garantiert h&ouml;chste Flexibilit&auml;t.";

content["main-nav"] = "<h2>Hauptnavigation</h2>Die Hauptnavigation dient dazu, den Besucher gezielt zu seinen gesuchten Informationen zu leiten und gleichzeitig das Themenspektrum der Website aufzuzeigen. in diesem Fall ist die erste Ebene dauerhaft sichtbar, f&auml;hrt man mit der Maus &uuml;ber einen Navigationspunkt, so klappt dieser aus und legt die zweite Ebene offen.";

content["navigation_showPathNavigation"] = "<h2>Pfadnavigation</h2>Die Pfad- oder Kr&uuml;melnavigation zeigt platzsparend, auf welcher (Unter-)Seite sich der Besucher gerade befindet. Dabei wird immer der vollst&auml;ndige Pfad angegeben.";

content["short_navigation_show"] = "<h2>Modul Schnellnavigation</h2>Die Schnellnavigation verweist auf beliebig viele interne Seiten. Durch Zusammenfassen der Links in einem Ordner k&ouml;nnen diese gemeinsam in der Schnellnavigation platziert werden. Es ist m&ouml;glich, mehrere unterschiedliche Schnellnavigationen anzeigen zu lassen (z.B. im Kopf- und Fu&szlig;bereich einer Seite).";

content["search2_showForm"] = "<h2>Suchfunktion</h2>Mit Hilfe der Suche k&ouml;nnen eingegebene Begriffe schnell und komfortabel gefunden werden.";

content["image_showGalleryImages"] = "<h2>Bildkatalog - Fotogalerie</h2>Die Fotogalerie bietet eine komfortable und zugleich sehr elegante L&ouml;sung, mehrere Bilder auf Ihrer Website darzustellen. Eine Bl&auml;ttern-Funktion ist dabei ebenso integriert wie der Vergr&ouml;&szlig;erungsmodus. Verwaltet wird eine solche Galerie im Bildkatalog des conrad:// Backends, wobei ein Ordner mit beliebig vielen Bildern eine Galerie sein kann.";

content["image_show"] = "<h2>Bildkatalog</h2>Im Bildkatalog werden alle auf der Website verwendeten Bilder verwaltet. Diese k&ouml;nnen im Frontend an beliebigen Stellen beliebig oft angezeigt werden.";

content["glossary_showGlossaryWidthIndex"] = "<h2>Modul Glossar</h2>Mit diesem Modul k&ouml;nnen Sie ein Glossar erstellen. Daf&uuml;r werden die Begriffe und deren Erkl&auml;rung im Backend gespeichert. Zur Darstellung im Internet k&ouml;nnen versch. Darstellungsvarianten gew&auml;hlt werden, in diesem Fall eine Listenansicht mit Index-Navigation.";

content["faq_showSlide"] = "<h2>Modul FAQ (slide-Variante)</h2>Mit Hilfe des FAQ-Moduls lassen sich h&auml;ufig gestellte Fragen beantworten. Durch einen Klick auf den Pfeil neben der Frage erh&auml;lt der Besucher die richtige Antwort. Neben der Erkl&auml;rung k&ouml;nnen auch weiterf&uuml;hrende Links und Dokumente angezeigt werden.";

content["faq_show"] = "<h2>Modul FAQ</h2>Mit Hilfe des FAQ-Moduls lassen sich h&auml;ufig gestellte Fragen beantworten. Durch einen Klick auf die Frage erh&auml;lt der Besucher die richtige Antwort. Neben der Erkl&auml;rung k&ouml;nnen auch weiterf&uuml;hrende Links und Dokumente angezeigt werden.";

content["download_show"] = "<h2>Modul Dokumente (Mehrfachauswahl)</h2>Mit Hilfe des Dokumentenmoduls k&ouml;nnen Downloads bequem verwaltet und auf der Website bereit gestellt werden. Dabei k&ouml;nnen im Backend versch. Ordner zur Gruppierung angelegt werden, damit nicht nur ein Dokument, sondern eine ganze Gruppe angezeigt werden. Das Modul unterst&uuml;tzt viele g&auml;ngige Formate wie .pdf, .ppt und .jpg.";

content["download_showSingle"] = "<h2>Modul Dokumente (Einzelauswahl)</h2>Mit Hilfe des Dokumentenmoduls k&ouml;nnen Downloads bequem verwaltet und auf der Website bereit gestellt werden. Das Modul unterst&uuml;tzt viele g&auml;ngige Formate wie .pdf, .ppt und .jpg.";

content["formgen_showForm_form_standard"] = "<h2>Modul Formulargenerator</h2>Mit Hilfe dieses Moduls k&ouml;nnen Sie Formulare (z.B. Kontaktformulare) erstellen, indem Sie einzelne Feldtypen anlegen und ggf. beschriften. Formulardaten k&ouml;nnen per Mail und/oder in der Datenbank, zur reinen Daten&uuml;bergabe auch gar nicht gespeichert werden. Auch ein Export als CSV-Datei ist m&ouml;glich.";

content["navigation_showLevel3"] = "<h2>Navigation 3. Ebene</h2>Die Navigation der dritten Ebene dient dem Besucher der Website, ebenfalls wie alle anderen Navigationen, zur Orientierung. Die Darstellung auf der Website ist abh&auml;ngig von dem jeweiligen Design.";