var is_mobile = false;

var last_id = "";
var last_obj = null;

var arr_content = new Array();
var arr_projects_head = new Array();
var arr_projects_body = new Array();
var arr_projects = new Array();
var arr_subprojects = new Array();

arr_content[ "index" ] = "\t\t\t<div class=\"linke_spalte\">\n\t\t\t\t\t<p>Jahrgang 56<span class=\"trenner\">|</span>aufgewachsen in Kanada; Schriftsetzer-Lehre und Grafik-Design-Studium in Deutschland<span class=\"trenner\">|</span>1980 bis 1987 in Frankfurt am Main: Layouter, Art Director, Illustrator.</p>\n\t\t\t\t\t<p>Seit 1988 in Hamburg: Partner in zwei inhabergeführten Werbeagenturen; Art-Direction, Konzeption und Marketingberatung<span class=\"trenner\">|</span>2001: Gründung IN FRONT GmbH, Hamburg, Netzwerk-Agentur, spezialisiert auf schnelle Print-Workflows für Versandhandelskataloge; Geschäftsführung, Steuerung und Art-Direction. Gestartet als Projekt, ist die Agentur bis heute erfolgreich tätig.</p>\n\t\t\t\t\t<p>Seit 2006: freie Projektberatung und -entwicklung ...</p>\n\t\t\t\t\t<p class =\"zitat\"><cite>&quot;Guten Ideen erfolgreiche Wege bahnen -<br /> kommunikativ stimmig machen und präsentabel<br />ins Bild setzen - <br />\ndas ist meine Passion und das, was ich tue.&quot;</cite></p>\n\t\t\t</div>\n\t\t\t<div class=\"rechte_spalte\" style=\"text-align: right;\">\n\t\t\t\t<img src=\"bilder/people1.jpg\" width=\"335\" height=\"280\" border=\"0\">\n\t\t\t</div>";

arr_content[ "konzept" ] = "\t\t\t<div class=\"linke_spalte\">\n\t\t\t\t<h3>Interessenfelder:</h3>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<li>Neue Produkte, Verfahren und Geschäftsfelder finden oder vorhandene konzeptionell weiterentwickeln, im Rahmen von</li>\n\t\t\t\t\t</ul>\n\t\t\t\t\t\t<ul class=\"unterliste\">\n\t\t\t\t\t\t\t<li>Launch-/Relaunch-Prozessen;</li>\n\t\t\t\t\t\t\t<li>Innovations-Prozessen.</li>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<li>Komplexe Strukturen und Prozesse transparent und verständlich visuell darstellen, z.B. als</li>\n\t\t\t\t\t</ul>\n\t\t\t\t\t\t<ul class=\"unterliste\">\n\t\t\t\t\t\t\t<li>Infografik,</li>\n\t\t\t\t\t\t\t<li>animierte Chart-Präsentation (Apple Keynote),</li>\n\t\t\t\t\t\t\t<li>wissenschaftliche Illustration.</li>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<li>&quot;Spin of&quot; aus vorhandenen Werbe- und Produktkonzepten entwickeln:</li>\n\t\t\t\t\t</ul>   \n\t\t\t\t\t\t<ul class=\"unterliste\">\n\t\t\t\t\t\t\t<li>On/offline-Aktivitäten zur Kundenbindung (Spiele-, Info-Konzepte, Produktentwicklungen);</li>\n\t\t\t\t\t\t\t<li>intelligente Content-Strategien;</li>\n\t\t\t\t\t\t\t<li>&quot;Below the line&quot;- Konzepte.</li>\n\t\t\t\t\t\t</ul>\n\t\t\t</div>\n\t\t\t<div class=\"rechte_spalte\">\n\t\t\t\t\n\t\t\t\t<h3>Arbeitsweise:</h3>\n\t\t\t\t\t<p>Vorzugsweise im Rahmen von Projekten<span class=\"trenner\">|</span>im Team oder in Eigenregie<span class=\"trenner\">|</span>projektführend oder konsultativ.</p>\n\t\t\t\t<h3>Fokus:</h3>\n\t\t\t\t\t<p>Innovative Produkte und Vertriebswege.</p>\n\t\t\t\t<h3>Stärken:</h3>\n\t\t\t\t\t<p>Interdisziplinär vernetzt denkend<span class=\"trenner\">|</span>stark im verständlichen Erklären und Veranschaulichen<span class=\"trenner\">|</span>flexibel und lösungsorientiert umsetzend</p>\n\t\t\t</div>";

arr_content[ "beratung" ] = "\t\t\t<div class=\"linke_spalte\">\n\t\t\t\t<h3>Beraten und begleiten ...</h3>\n\t\t\t\t\t<ul><li>in Innovationsprozessen:</li></ul>\n\t\t\t\t\t\t<ul class=\"unterliste\">\n\t\t\t\t\t\t\t<li>Klären und fokussieren, nachjustieren und bestärken des Innovationsprozesses;</li>\n\t\t\t\t\t\t\t<li>Ideenfindung und -erweiterung, Umsetzungskonzeption;</li>\n\t\t\t\t\t\t\t<li>Präsentation der Ergebnisse des Innovations-Prozesses (visuelle Darstellung für interne oder externe Zwecke).</li>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t<ul><li>in geschäftlichen Veränderungsprozessen:</li></ul>\n\t\t\t\t\t\t<ul class=\"unterliste\">\n\t\t\t\t\t\t\t<li>Unternehmensangebote veränderter Marktsituation anpassen (Launch/Relaunch-Prozesse);</li>\n\t\t\t\t\t\t\t<li>Strategische Neuausrichtung.</li>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t<ul><li>bei (Re-)StartUps,</li></ul>\n\t\t\t\t\t\t<ul class=\"unterliste\">\n\t\t\t\t\t\t\t<li>wenn unabhängiger Blick von Aussen zur Entscheidungsfindung benötigt wird.</li>\n\t\t\t\t\t\t</ul>\n\t\t\t</div>\n\t\t\t<div class=\"rechte_spalte\">\n\t\t\t\t<h3>Mein Selbstverständnis:</h3>\n\t\t\t\t\t<p>Gleichzeitig Sparringspartner und Impulsgeber zu sein, pragmatisch und visionär, thematisch fokussiert, stärkenorientiert und ermutigend.</p>\n\t\t\t\t<h3>Zielgruppe:</h3>\n\t\t\t\t\t<p>Entscheider in Innovations-, Veränderungsprozessen oder in Gründungsphasen<span class=\"trenner\">|</span>Freiberufler oder Start-ups<span class=\"trenner\">|</span><br/>aus unterschiedlichen Branchen und Unternehmensbereichen</p>\n\t\t\t\t<h3>Stärken:</h3>\n\t\t\t\t\t<p>Kreativer Mitdenker mit versiertem Blick für komplexe Systeme und Zusammenhänge<span class=\"trenner\">|</span>feines Gespür für Chancen und Potenziale<span class=\"trenner\">|</span>flexibel und loyal.</p>\n\t\t\t</div>";

arr_content[ "grafik" ] = "\t\t\t<div class=\"linke_spalte\">\n\t\t\t\t<h3>Handwerk - klassisch:</h3>\n\t<p>Typografisch versiert<span class=\"trenner\">|</span>scribble- und layout-stark</p>\n\t\t\t\t<h3>Screen-Design:</h3>\n\t\t\t\t\t<p>QXpress, In Design, Photoshop, Illustrator, Flash, Cinema 4d ...</p>\n\t\t\t\t<h3>Kompetenz in Art- und Creative-Direction, Marketing-Konzeption:</h3>\n\t\t\t\t\t<p>CI-Design, Markenpflege, klassische Printkampagnen, Sales Promotion (B2B und B2C)<span class=\"trenner\">|</span>Gesamtetat-Betreuung<span class=\"trenner\">|</span><br/>langjährige Agenturerfahrung, team- und führungserprobt.</p>\n\t\t\t\t<h3>Präsentations-Produktion:</h3>\n<p>Konzept, Drehbuch, Storyboard<span class=\"trenner\">|</span>Design, Animation<span class=\"trenner\">|</span><br/>Keynote, Flash, Quicktime, PDF ...</p>\n\t\t\t</div>\n\t\t\t<div class=\"rechte_spalte\">\n\t\t\t\t<h3>Branchenkenntnis:</h3>\n\t\t\t\t\t<p>Konsumgüter, Food, Airlines, Tourismus, Länderwerbung, Versandhandel ...</p>\n\t\t\t\t<h3>Manpower:</h3>\n\t\t\t\t\t<p>Spezialisten-Netzwerk, flexibel und dynamisch zu aktivieren<span class=\"trenner\">|</span><br/>Full Service-Agenturleistung verfügbar durch<br/><a href=\"http://www.connex-werbung.de\" title=\"Link zu www.Connex-werbung.de\">Agenturanbindung in Berlin</a></p>\n\t\t\t\t<h3>Illustration:</h3>\n\t\t\t\t\t<p>Umfangreiches Illustrations-Repertoire.<br/>Kleiner Überblick über Stile und Techniken:<br/><a href=\"http://www.christian-thamm.eu/portfolio/start\" title=\"Link zu portfolio - shortcut\">portfolio - shortcut</a></p>\n\t\t\t</div>";

arr_content[ "projekte" ] = "\t\t\t<div class=\"linke_spalte\">\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<li>Sachbuch-Projekt (Print- und interaktive Online-Version; Konzeption)</li>\n\t\t\t\t\t\t<li>user interface-Design für das iPad (innovative Ansätze; Konzeptstudie)</li>\n\t\t\t\t\t\t<li>Kinderbuch-Projekt (konzipiert als Buch und als Flashfilm mit interaktiven Steuerungsmöglichkeiten)</li>\n\t\t\t\t\t\t<li>...</li>\n\t\t\t\t\t</ul>\n\t\t\t\t\n\t\t\t</div>\n\t\t\t\n\t\t\t<div class=\"rechte_spalte\">\n\t\t\t\t\n\t\t\t</div>";

arr_content[ "kontakt" ] = "\t\t\t<div class=\"kontakt\">\n\t\t\t\t<h3>Christian Thamm</h3>\n\t\t\t\t\t<p>Uhlenhorster Weg 37<span class=\"trenner\">|</span>D-22085 Hamburg<br/>Mobil: +49 170 - 58 89 886<span class=\"trenner\">|</span>connect(ät)christian-thamm.eu</p>\n\t\t\t\t\t<form id=\"kontaktformular\" action=\"\" method=\"post\">\n\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t<label for=\"adresse\">Ihre E-Mail-Adresse:</label>\n\t\t\t\t\t\t\t<input type=\"text\" name=\"adresse\" id=\"adresse\" />\n\t\t\t\t\t\t</p>\n\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t<label for=\"betreff\">Betreff:</label>\n\t\t\t\t\t\t\t<input type=\"text\" name=\"betreff\" id=\"betreff\" />\n\t\t\t\t\t\t</p>\n\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t<label for=\"nachricht\">Ihre Nachricht:</label>\n\t\t\t\t\t\t\t<textarea name=\"nachricht\" id=\"nachricht\" cols=\"45\" rows=\"10\"></textarea>\n\t\t\t\t\t\t</p>\n\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t<input type=\"submit\" name=\"senden\" id=\"senden\" class=\"button\" value=\"Senden\" /><div class=\"error\" id=\"error\"> </div>\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</form>\n\t\t\t</div>\n\t\t\t<div class=\"impressum\">\n\t\t\t\t<h3>Impressum:</h3>\n\t\t\t\t\t<p>Verantwortlich für den Inhalt: Christian Thamm.</p>\n\t\t\t\t\t<p>USt-Ident-Nr. Christian Thamm: DE158097429.</p>\n\t\t\t\t\t<p>Copyright: Sofern nicht anders angegeben sind alle Inhalte<br/>Copyright © 2010 Christian Thamm. Zitieren oder Weiterverwenden der Inhalte - auch auszugsweise - bedürfen vorab der ausdrücklichen Genehmigung.</p>\n\t\t\t\t\t<p>Haftungsausschluß: Trotz sorgfältiger Auswahl und Kontrolle übernehme ich keine Haftung für die Inhalte externer Links. Für den Inhalt der verlinkten Seiten sind ausschließlich deren Betreiber verantwortlich.</p>\n\t\t\t\t\t<p>Konzept und Design: Christian Thamm<br/>Code: <a href=\"http://www.kosmokrator.com\" title=\"Link zu www.kosmokrator.com\">www.kosmokrator.com</a><br/>Portrait-Foto: <a href=\"http://www.traubenberg.net\" title=\"Link zu www.traubenberg.net\">www.traubenberg.net</a></p>\n\t\t\t\t\t\n\t\t\t</div>";

arr_projects[ 0 ] = "projekte_1";

arr_projects_head[ "projekte_1" ] = "<a id=\"menue_projekte\" href=\"projekte.php\" title=\"zur Seite PROJEKTE\"><i>PROJEKTE &gt;</i> PROJEKT 1</a>";

arr_projects_body[ "projekte_1" ] = "\t\t\t<div class=\"projekte_details\">\n\t\t\t\t<p>Projekt 1. Einblick in Arbeiten und Projekte, die entweder in eigener Regie entstanden sind oder mit denen ich gesamtverantwortlich beauftragt war. Arbeiten jedenfalls, an deren Veröffentlichung mir etwas liegt. Eine persönliche Auswahl also, bewußt unvollständig und nicht chronologisch geordnet. Aktualität: Diese Site ist jung und das Meiste, das hier zu sehen sein soll, ist noch im Entstehen. Es dauert also noch ein Weilchen, bis es hier eingestellt ist ...</p>\n\t\t\t\t<h3>Blindtext:</h3>\n\t\t\t\t<ul>\n\t\t\t\t\t<li>Blindtext</li>\n\t\t\t\t\t<li>Blindtext blindtext</li>\n\t\t\t\t</ul>\n\t\t\t\t<div>\n\t\t\t\t\t<a id=\"projekte_1_1\" href=\"projekte_1_1.php\" class=\"project_details_thumbnail\"><img src=\"bilder/test.png\" width=\"90\" height=\"56\" border=\"0\"></a>\n\t\t\t\t\t<a id=\"projekte_1_2\" href=\"projekte_1_2.php\" class=\"project_details_thumbnail\"><img src=\"bilder/test.png\" width=\"90\" height=\"56\" border=\"0\"></a>\n\t\t\t\t\t<a id=\"projekte_1_3\" href=\"projekte_1_3.php\" class=\"project_details_thumbnail\"><img src=\"bilder/test.png\" width=\"90\" height=\"56\" border=\"0\"></a>\n\t\t\t\t\t<a id=\"projekte_1_4\" href=\"projekte_1_4.php\" class=\"project_details_thumbnail\"><img src=\"bilder/test.png\" width=\"90\" height=\"56\" border=\"0\"></a>\n\t\t\t\t</div>\n\t\t\t</div>";


arr_projects[ 1 ] = "projekte_2";

arr_projects_head[ "projekte_2" ] = "<a id=\"menue_projekte\" href=\"projekte.php\" title=\"zur Seite PROJEKTE\"><i>PROJEKTE &gt;</i> PROJEKT 2</a>";

arr_projects_body[ "projekte_2" ] = "\t\t\t<div class=\"projekte_details\">\n\t\t\t\t<p>Projekt 2. Einblick in Arbeiten und Projekte, die entweder in eigener Regie entstanden sind oder mit denen ich gesamtverantwortlich beauftragt war. Arbeiten jedenfalls, an deren Veröffentlichung mir etwas liegt. Eine persönliche Auswahl also, bewußt unvollständig und nicht chronologisch geordnet. Aktualität: Diese Site ist jung und das Meiste, das hier zu sehen sein soll, ist noch im Entstehen. Es dauert also noch ein Weilchen, bis es hier eingestellt ist ...</p>\n\t\t\t\t<h3>Blindtext:</h3>\n\t\t\t\t<ul>\n\t\t\t\t\t<li>Blindtext</li>\n\t\t\t\t\t<li>Blindtext blindtext</li>\n\t\t\t\t</ul>\n\t\t\t</div>";


arr_subprojects[ 0 ] = "projekte_1_1";

arr_projects_head[ "projekte_1_1" ] = "<a id=\"menue_projekte\" href=\"projekte.php\" title=\"zur Seite PROJEKTE\"><i>PROJEKTE &gt; PROJEKT 1 &gt;</i> Details 1</a>";

arr_projects_body[ "projekte_1_1" ] = "\t\t\t<div class=\"projekte_details\">\n\t\t\t\t<p>Projekt 1 Details 1.</p>\n\t\t\t\t<img src=\"bilder/test.png\" width=\"270\" height=\"168\" border=\"0\">\n\t\t\t</div>";


arr_subprojects[ 1 ] = "projekte_1_2";

arr_projects_head[ "projekte_1_2" ] = "<a id=\"menue_projekte\" href=\"projekte.php\" title=\"zur Seite PROJEKTE\"><i>PROJEKTE &gt; PROJEKT 1 &gt;</i> Details 2</a>";

arr_projects_body[ "projekte_1_2" ] = "\t\t\t<div class=\"projekte_details\">\n\t\t\t\t<p>Projekt 1 Details 2.</p>\n\t\t\t\t<img src=\"bilder/test.png\" width=\"270\" height=\"168\" border=\"0\">\n\t\t\t</div>";


arr_subprojects[ 2 ] = "projekte_1_3";

arr_projects_head[ "projekte_1_3" ] = "<a id=\"menue_projekte\" href=\"projekte.php\" title=\"zur Seite PROJEKTE\"><i>PROJEKTE &gt; PROJEKT 1 &gt;</i> Details 3</a>";

arr_projects_body[ "projekte_1_3" ] = "\t\t\t<div class=\"projekte_details\">\n\t\t\t\t<p>Projekt 1 Details 3.</p>\n\t\t\t\t<img src=\"bilder/test.png\" width=\"270\" height=\"168\" border=\"0\">\n\t\t\t</div>";


arr_subprojects[ 3 ] = "projekte_1_4";

arr_projects_head[ "projekte_1_4" ] = "<a id=\"menue_projekte\" href=\"projekte.php\" title=\"zur Seite PROJEKTE\"><i>PROJEKTE &gt; PROJEKT 1 &gt;</i> Details 4</a>";

arr_projects_body[ "projekte_1_4" ] = "\t\t\t<div class=\"projekte_details\">\n\t\t\t\t<p>Projekt 1 Details 4.</p>\n\t\t\t\t<img src=\"bilder/test.png\" width=\"270\" height=\"168\" border=\"0\">\n\t\t\t</div>";



$( document ).ready(
	function() {
		if ( is_mobile ) {
		} else {
			$( "#menue_index"		).bind( "click", function() { LoadContent( "index"		, false ); return false; } );
			$( "#menue_konzept"		).bind( "click", function() { LoadContent( "konzept"	, false ); return false; } );
			$( "#menue_beratung"	).bind( "click", function() { LoadContent( "beratung"	, false ); return false; } );
			$( "#menue_grafik"		).bind( "click", function() { LoadContent( "grafik"		, false ); return false; } );
			$( "#menue_projekte"	).bind( "click", function() { LoadContent( "projekte"	, false ); return false; } );
			$( "#menue_kontakt"		).bind( "click", function() { LoadKontakt(); return false; } );
			var content = $( "#menue_projekte" );
			content.parent().next().height( "0px" );
		}
	}
);

function LoadContent( id, is_open ) {
	var button = $( "#menue_projekte" );
	button.html( "PROJEKTE" );
	$( "#menue_projekte" ).unbind( "click" );
	$( "#menue_projekte" ).bind( "click", function() { LoadContent( "projekte", false ); return false; } );
	var content = $( "#content_kontakt" );
	content.parent().fadeOut();
	$( ".kontakt" ).fadeOut();
	$( ".impressum" ).fadeOut();
	content.parent().next().animate( { height: "0px" } );
	//	accordion animation ...
	var button = $( "#menue_" + id );
	if ( is_open ) {
		button.parent().next().html( arr_content[ id ] );
		for ( var i = 0; i < arr_projects.length; i++ ) {
				$( "#" + arr_projects[ i ] ).bind( "click", { main: i + 1 }, function( event ) { LoadProject( event.data.main ); return false; } );
		}
	} else if ( button.parent().next().height() > 0 ) {
		last_id = "";
		last_obj = null;
		button.parent().addClass( "menue" );
		button.parent().removeClass( "menue_high" );
		button.parent().next().animate( { height: "0px" } );
		button.blur();
	} else {
		if ( last_obj != null ) {
			last_obj.parent().addClass( "menue" );
			last_obj.parent().removeClass( "menue_high" );
			last_obj.parent().next().animate( { height: "0px" } );
		}
		last_id = id;
		last_obj = button;
		button.parent().addClass( "menue_high" );
		button.parent().removeClass( "menue" );
		button.parent().next().html( arr_content[ id ] );
		if ( id == "projekte" ) {
			for ( var i = 0; i < arr_projects.length; i++ ) {
				$( "#" + arr_projects[ i ] ).bind( "click", { main: i + 1 }, function( event ) { LoadProject( event.data.main ); return false; } );
			}
			button.parent().next().animate( { height: "300px" } );
		} else {
			button.parent().next().animate( { height: "300px" } );
		}
		button.blur();
	}
}

function LoadKontakt() {
	var button = $( "#menue_projekte" );
	button.html( "PROJEKTE" );
	var button = $( "#menue_kontakt" );
	if ( last_obj != null ) {
		last_obj.parent().addClass( "menue" );
		last_obj.parent().removeClass( "menue_high" );
		last_obj.parent().next().animate( { height: "0px" } );
		last_id = "";
		last_obj = null;
	}
	button.blur();
	var content = $( "#content_kontakt" );
	content.parent().next().html( arr_content[ "kontakt" ] );
	content.parent().fadeIn();
	content.parent().next().animate( { height: "260px" } );
	PrepareSubmit();
}

function PrepareSubmit() {
	var button = $( "#menue_index" );
	button.parent().addClass( "menue" );
	button.parent().removeClass( "menue_high" );
	$( "#kontaktformular" ).submit(
		function( evt ) {
			var email = $( "#adresse" ).val();
			var message = $( "#nachricht" ).val();
			if ( email == "" ) {
				$( "#error" ).html( "<b>Bitte Ihre E-Mail-Adresse eintragen ...</b>" );
			} else if ( message == "" ) {
				$( "#error" ).html( "<b>Bitte Ihre Nachricht eintragen ...</b>" );
			} else {
				$( "#senden" ).css( "visibility", "hidden" );
				$( "#error" ).html( "Die Nachricht wird gesendet ..." );
				var url = "kontakt_send.php";
				var params = {};
				for ( var i = 0; i < this.elements.length; i++ ) {
					e = this.elements[ i ];
					params[ e.name ] = e.value;
				}
				$.post( url, params, ShowSuccess );
			}
			return false;
		}
	);
}

function ShowSuccess() {
	$( "#error" ).html( "Danke für Ihre Nachricht!" );
}

function LoadProject( id ) {
	var content = $( "#menue_projekte" );
	$( "#menue_projekte" ).unbind( "click" );
	$( "#menue_projekte" ).bind( "click", function() { LoadContent( "projekte", true ); return false; } );
	content.html( arr_projects_head[ "projekte_" + id ] );
	content.parent().next().html( arr_projects_body[ "projekte_" + id ] );
	for ( var i = 0; i < arr_subprojects.length; i++ ) {
		$( "#" + arr_subprojects[ i ] ).bind( "click", { main: id, sub: i + 1 }, function( event ) { LoadDetails( event.data.main, event.data.sub ); return false; } );
	}
}

function LoadDetails( main, sub ) {
	var content = $( "#menue_projekte" );
	$( "#menue_projekte" ).unbind( "click" );
	$( "#menue_projekte" ).bind( "click", function() { LoadProject( main ); return false; } );
	content.html( arr_projects_head[ "projekte_" + main + "_" + sub ] );
	content.parent().next().html( arr_projects_body[ "projekte_" + main + "_" + sub ] );
}