/*********************************************************************
STADTKREATION
sitte_memory.js - Version 1.0 - JavaScript-Text für das Sitte-Memory
Geschrieben im Juli 2005 von Johannes Bouchain
Copyright (c) 2005 by stadtkreation.de
*********************************************************************/

var sumImages = 57;		    // legt die Summe der verschiedenen Bilder fest
var turnedPairs = 0;                // zählt die aufgedeckten Paare
var Round = 0;                      // zählt die Runden
var Turned = 0;                     // zählt die im aktuellen Zug aufgedeckten Karten
var blockGameLinks = 1;             // blockiert die Links auf dem Spielbrett bei Anzeigen eines Info-Fensters (1: blockiert, 0: nicht blockiert)
var SelectedImage = new Array();    // Array zum Speichern der zwölf von 57 ausgewählten Motive
var Image = new Array();            // Array zum Speichern der Nummer des .jpg-Bildes, das einem der zwölf Paare zugewiesen ist
var Card = new Array();             // Array zum Speichern der den Kartenplätzen (1-24) zugewiesenen Motive
var TurnedCard = new Array();       // Array zum Speichern der Position der beiden umgedrehten Karten
var Selected = new Array();         // Array zum Speichern der ausgewählten Motive (0-2)
var TurnedImage = new Array();      // Array zum Speichern der Nummern der umgedrehten .jpg-Bilder
var AlreadyUsed = new Array();      // Array zum Speichern, dass das Bild bereits in einem Spiel verwendet wurde
var positionSelected = new Array(); // Array zum Speichern, ob eine Kartenposition bereits mit einem Motiv belegt ist

function prepareGame() { // Funktion zum Vorbereiten des Spiels und zum Auswählen der Motive

	// Löscht die Karten und den Zähler, wenn das Spiel neu gestartet wird
	if(Round > 0) {
		if(document.getElementById("info-window").hasChildNodes()) hideInfoWindow();
		document.getElementById("counter").removeChild(document.getElementById("counter").firstChild);
		document.getElementById("spiele").href="../index.html";
		for(var i=1;i<=24;i++) {

		document.getElementById("card"+i).removeChild(document.getElementById("card"+i).firstChild);
		}
	}
	else document.getElementById("counter-window").appendChild(document.createTextNode("Runde "));

	document.getElementById("counter-window").appendChild(document.createElement("span"));
	document.getElementById("counter-window").lastChild.id="counter";
	document.getElementById("counter").appendChild(document.createTextNode(""));

	// Setzt die Werte aller Variablen auf die Ausgangswerte
	turnedPairs = 0;
	Round = 0;
	Turned = 0;
	blockGameLinks = 1;
	for(var i=1; i<=sumImages; i++) SelectedImage[i] = 0;

	TurnedImage[0] = 1; TurnedImage[2] = 0;

	for(var i=0; i<=24; i++) {
		Selected[i] = 0;
		TurnedCard[i] = 0;
		positionSelected[i] = 0;
	}


	// Wählt zwölf Motive aus den 57 zur Verfügung stehenden Motiven aus
	for(var i=1; i<=12;i++) {
		var randomNumber = Math.ceil(Math.random()*sumImages);
			var firstRandom = randomNumber;
			while(SelectedImage[randomNumber]>0 || AlreadyUsed[randomNumber] == 1) {
				randomNumber = randomNumber + 1;
				if(randomNumber == sumImages + 1) randomNumber = 1;
				if(randomNumber == firstRandom) {
					for(j=1;j<=sumImages;j++) AlreadyUsed[j] = 0; }
			}
			Image[i] = randomNumber;
			AlreadyUsed[randomNumber] = 1;
		SelectedImage[randomNumber] = SelectedImage[randomNumber] + 1;
	}

	// Die Funktion zum Auslegen der Karten wird aufgerufen
	distributeCards()
}


function distributeCards() { // Funktion zum Auslegen der Karten

	// Setzt den Counter auf 1
	Round = 1;
	printText();

	// Weist den 24 Plätzen in zufälliger Reihenfolge zweimal die zwölf ausgewählten Motive zu
	for(var i=1; i<=24;i++) {
		var randomNumber = Math.ceil(Math.random()*12);
		var randomPosition = Math.ceil(Math.random()*24);
		while(Selected[randomNumber]>1) {
			randomNumber = randomNumber + 1;
			if(randomNumber == 13) randomNumber = 1; }
		while(positionSelected[randomPosition]>0) {
			randomPosition = randomPosition + 1;
			if(randomPosition == 25) randomPosition = 1; }
		Card[randomPosition] = randomNumber;
		var newElement = document.createElement("img");
		document.getElementById("card"+randomPosition).appendChild(newElement);
		document.getElementById("card"+randomPosition).firstChild.src="images_sitte/back.jpg";
		document.getElementById("card"+randomPosition).firstChild.alt="images_sitte/back.jpg";
		document.getElementById("card"+randomPosition).firstChild.title="klicken zum Umdrehen - click to turn - cliquez pour tourner";
		document.getElementById("card"+randomPosition).href="javascript:turnCard("+randomPosition+")";
		Selected[randomNumber] = Selected[randomNumber] + 1;
		positionSelected[randomPosition] = 1;
	}

	// Die Funktion zum Anzeigen des Startbildes wird aufgerufen
	StartImage();

}


function StartImage() { // Funktion zum Anzeigen des Startbildes
	var newElement = document.createElement("a");
	document.getElementById("info-window").appendChild(newElement);
	document.getElementById("info-window").lastChild.id="info-window-content";
	document.getElementById("info-window").lastChild.href="javascript:hideInfoWindow()";
	document.getElementById("info-window").style.border="1px solid #333333";
	var newElement = document.createElement("img");
	document.getElementById("info-window-content").appendChild(newElement);
	document.getElementById("info-window-content").lastChild.src="images_sitte/sitte_title.jpg";
	document.getElementById("info-window-content").lastChild.alt="images_sitte/sitte_title.jpg";
	document.getElementById("info-window-content").lastChild.title="click here to begin - cliquez ici pour commencer";
}

function turnCard(cardNumber) { // Funktion zum Ausführen der unterschiedlichen Aktionen beim Umdrehen der Karten
	if(blockGameLinks == 0) {

		// Wenn die angeklickte Karte noch zugedeckt war und kein Info-Fenster geöffnet ist
		if(TurnedCard[cardNumber] == 0 && document.getElementById("info-window").hasChildNodes() == false) {

			// Wenn im aktuellen Zug noch keine zwei Karten umgedreht wurden
			if(Turned<2) {
				if(Image[Card[cardNumber]] >= 10) {
					document.getElementById("card"+cardNumber).firstChild.src="images_sitte/sitte" + Image[Card[cardNumber]] + "_sm.jpg";
					document.getElementById("card"+cardNumber).firstChild.alt="images_sitte/sitte" + Image[Card[cardNumber]] + "_sm.jpg"; }
				if(Image[Card[cardNumber]] < 10) {
					document.getElementById("card"+cardNumber).firstChild.src="images_sitte/sitte0" + Image[Card[cardNumber]] + "_sm.jpg";
					document.getElementById("card"+cardNumber).firstChild.alt="images_sitte/sitte0" + Image[Card[cardNumber]] + "_sm.jpg"; }
				document.getElementById("card"+cardNumber).firstChild.title="klicken zum Vergrößern - click to enlarge - cliquez pour agrandir";
				TurnedCard[cardNumber] = 1;
				Turned = Turned + 1;
				TurnedImage[Turned] = cardNumber;

				// Wenn die gerade aufgedeckte Karte gleich der ersten aufgedeckten ist und nun alle 12 Paare offen liegen, wird das Spielende in einem Fenster angezeigt
				if(Turned == 2 && Card[TurnedImage[1]] == Card[TurnedImage[2]]) {
					turnedPairs = turnedPairs + 1;
					printText();
					if(turnedPairs == 12) {
						allPairsTurned(); }
					}
				}

			// Wenn im aktuellen Zug bereits zwei Karten aufgedeckt wurden
			else {

				// Wenn die beiden Karten unterschiedlich sind, werden beide bei Anklicken einer neuen Karte wieder zugedeckt
				if(Card[TurnedImage[1]] != Card[TurnedImage[2]]) {
					for(var i=1;i<=2;i++) {
						document.getElementById("card"+TurnedImage[i]).firstChild.src="images_sitte/back.jpg";
						document.getElementById("card"+TurnedImage[i]).firstChild.alt="images_sitte/back.jpg";
						TurnedCard[TurnedImage[i]] = 0;
						Turned = 0;
						TurnedImage[i] = 0;
					}
					addRound();
				}

				// Wenn die beiden Karten gleich sind, bleiben sie bei Anklicken einer neuen Karte offen liegen
				else {
					for(var i=1;i<=2;i++) {
						document.getElementById("card"+TurnedImage[i]).href="javascript:showInfoWindow("+TurnedImage[i]+")";
						TurnedCard[TurnedImage[i]] = 0;
						Turned = 0;
						TurnedImage[i] = 0;
					}
					addRound();
				}

				// Dreht die erste Karte des neuen Zuges um
				turnCard(cardNumber);
			}
		}

		// Wenn die angeklickte Karte bereits aufgedeckt war oder das Info-Fenster geöffnet ist
		else showInfoWindow(cardNumber);
	}
}

function showInfoWindow(cardNumber) { // Funktion zum Anzeigen des entsprechenden Motivs in Originalgröße bzw. zum Schließen der Anzeige

	if(document.getElementById("info-window").hasChildNodes() == false && blockGameLinks == 0) {
		var newElement = document.createElement("a");
		document.getElementById("info-window").appendChild(newElement);
		document.getElementById("info-window").lastChild.id="info-window-content";
		document.getElementById("info-window").lastChild.href="javascript:hideInfoWindow()";
		document.getElementById("info-window").style.border="1px solid #333333";
		var newElement = document.createElement("img");
		document.getElementById("info-window-content").appendChild(newElement);
		if(Image[Card[cardNumber]] >= 10) {
			document.getElementById("info-window-content").lastChild.src="images_sitte/sitte" + Image[Card[cardNumber]] + ".jpg";
			document.getElementById("info-window-content").lastChild.alt="images_sitte/sitte" + Image[Card[cardNumber]] + ".jpg"; }
		if(Image[Card[cardNumber]] < 10) {
			document.getElementById("info-window-content").lastChild.src="images_sitte/sitte0" + Image[Card[cardNumber]] + ".jpg";
			document.getElementById("info-window-content").lastChild.alt="images_sitte/sitte0" + Image[Card[cardNumber]] + ".jpg"; }

		document.getElementById("info-window-content").lastChild.title="klicken zum Schließen - click to close - cliquez pour fermer";
		}
	else {
		if(blockGameLinks == 0) hideInfoWindow();
		}
}

function hideInfoWindow() { // Funktion zum Schließen des Info-Fensters
	blockGameLinks = 0;
	if(Round == 1) { 
		document.getElementById("spiele").href="javascript:quitGame(2)";
	}
	if(turnedPairs ==12) {
		document.getElementById("spiele").href="../index.html";
	}
	document.getElementById("info-window-content").style.height="auto";
	document.getElementById("info-window-content").style.top="0px"
	document.getElementById("info-window").removeChild(document.getElementById("info-window-content"));
	document.getElementById("info-window").style.border="0";
}

function quitGame(linkNumber) { // Funktion zur Abfrage für einen Neustart des Spiels


	// Wenn kein Info-Fenster geöffnet ist und die Links auf dem Spielfeld nicht blockiert sind

	if(document.getElementById("info-window").hasChildNodes() == false && blockGameLinks == 0) {

		// Wenn noch nicht alle Paare aufgedeckt wurden
		if(turnedPairs < 12) {
			blockGameLinks = 1;
			var newElement = document.createElement("p");
			if(linkNumber == 1) var newText = document.createTextNode("Spiel abbrechen und neu beginnen?");
			else var newText = document.createTextNode("Spiel verlassen?");
			newElement.appendChild(newText);
			document.getElementById("info-window").appendChild(newElement);
			document.getElementById("info-window").firstChild.id="info-window-content";
			document.getElementById("info-window-content").style.top="170px";
			var newElement = document.createElement("br");
			document.getElementById("info-window-content").appendChild(newElement);
			var newElement = document.createElement("a");
			var newText = document.createTextNode("Ja");
			newElement.appendChild(newText);
			document.getElementById("info-window-content").appendChild(newElement);
			if(linkNumber == 1) document.getElementById("info-window-content").lastChild.href="javascript:prepareGame()";
			if(linkNumber == 2) document.getElementById("info-window-content").lastChild.href="../index.html";
			var newElement = document.createElement("a");
			var newText = document.createTextNode("Nein");
			newElement.appendChild(newText);
			document.getElementById("info-window-content").appendChild(newElement);
			document.getElementById("info-window-content").lastChild.href="javascript:hideInfoWindow()";
		}

		// Wenn bereits alle Paare aufgedeckt wurden
		else prepareGame();
	}
}

function newRound() { // Funktion zur Abfrage für den Beginn eines neuen Spielzugs

	// Wenn kein Info-Fenster geöffnet ist und die Links auf dem Spielfeld nicht blockiert sind
	if(document.getElementById("info-window").hasChildNodes() == false && blockGameLinks == 0) {

		// Wenn im aktuellen Zug noch keine zwei oder zwei gleiche Karten umgedreht wurden
		if(Turned < 2 || Turned == 2 && Card[TurnedImage[1]] == Card[TurnedImage[2]]) {
			blockGameLinks = 1;
			var newElement = document.createElement("p");
			if(turnedPairs < 12) var newText = document.createTextNode("Zwei ungleiche Karten einer Runde müssen aufgedeckt sein!");
			else var newText = document.createTextNode("Es sind bereits alle Karten aufgedeckt!");
			newElement.appendChild(newText);
			document.getElementById("info-window").appendChild(newElement);
			document.getElementById("info-window").firstChild.id="info-window-content";
			document.getElementById("info-window-content").style.top="170px";
			var newElement = document.createElement("br");
			document.getElementById("info-window-content").appendChild(newElement);
			var newElement = document.createElement("a");
			var newText = document.createTextNode("OK");
			newElement.appendChild(newText);
			document.getElementById("info-window-content").appendChild(newElement);
			document.getElementById("info-window-content").lastChild.href="javascript:hideInfoWindow()";

			// Einfügen des Links für ein neues Spiel, wenn alle Paare aufgedeckt sind
			if(turnedPairs == 12) {
				var newElement = document.createElement("a");
				var newText = document.createTextNode("Neues Spiel");
				newElement.appendChild(newText);
				document.getElementById("info-window-content").appendChild(newElement);
				document.getElementById("info-window-content").lastChild.href="javascript:prepareGame()";
			}
		}

		// Wenn im aktuellen Zug bereits zwei unterschiedliche Karten aufgedeckt wurden
		else {
			for(var i=1;i<=2;i++) {
					document.getElementById("card"+TurnedImage[i]).firstChild.src="images_sitte/back.jpg";
					document.getElementById("card"+TurnedImage[i]).firstChild.alt="images_sitte/back.jpg";
					TurnedCard[TurnedImage[i]] = 0;
					Turned = 0;
					TurnedImage[i] = 0;
				}
			addRound();
		}
	}
}

function Information() { // Funktion zum Anzeigen des Info-Fensters

	// Wenn kein Info-Fenster geöffnet ist und die Links auf dem Spielfeld nicht blockiert sind
	if(document.getElementById("info-window").hasChildNodes() == false && blockGameLinks == 0) {

		blockGameLinks = 1;
		var newElement = document.createElement("div");
		document.getElementById("info-window").appendChild(document.createElement("div"));
		document.getElementById("info-window").firstChild.id="info-window-content";
		document.getElementById("info-window-content").style.height="400px";
		document.getElementById("info-window-content").style.border="1px solid #333333";
		var newElement = document.createElement("h1");
		var newText = document.createTextNode("Camillo Sitte");
		newElement.appendChild(newText);
		document.getElementById("info-window-content").appendChild(newElement);
		var newElement = document.createElement("p");
		var newText = document.createTextNode("Ein Memory-Spiel");
		newElement.appendChild(newText);
		document.getElementById("info-window-content").appendChild(newElement);
		document.getElementById("info-window-content").lastChild.id="information-content";
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createTextNode("Version 1.0 - Juli 2005"));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createTextNode("Motive entnommen aus dem 1889 erschienenen Werk"));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createTextNode("\"Der Städtebau nach seinen künstlerischen Grundsätzen\""));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createTextNode("von Camillo Sitte (Architekt und Stadtplaner, 1843-1903)"));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createTextNode("Digitalisierung und Aufbereitung der Bilder: Arend Kölsch"));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createTextNode("Geschrieben von Johannes Bouchain"));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createTextNode("Präsentiert von stadtkreation.de"));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		document.getElementById("information-content").appendChild(document.createElement("br"));
		var newElement = document.createElement("a");
		var newText = document.createTextNode("OK");
		newElement.appendChild(newText);
		document.getElementById("information-content").appendChild(newElement);
		document.getElementById("information-content").lastChild.href="javascript:hideInfoWindow()";
	}
}

function Description() { // Funktion zum Anzeigen des Spielregeln-Fensters

	// Wenn kein Info-Fenster geöffnet ist und die Links auf dem Spielfeld nicht blockiert sind
	if(document.getElementById("info-window").hasChildNodes() == false && blockGameLinks == 0) {

		blockGameLinks = 1;
		var newElement = document.createElement("div");
		document.getElementById("info-window").appendChild(document.createElement("div"));
		document.getElementById("info-window").firstChild.id="info-window-content";
		document.getElementById("info-window-content").style.height="400px";
		document.getElementById("info-window-content").style.border="1px solid #333333";
		document.getElementById("info-window-content").appendChild(document.createElement("p"));
		document.getElementById("info-window-content").lastChild.id="description-content";
		document.getElementById("description-content").appendChild(document.createTextNode("Eklärung des Spiels:"));
		document.getElementById("description-content").appendChild(document.createElement("br"));
		document.getElementById("description-content").appendChild(document.createTextNode("Ziel des Spieles ist es, in möglichst wenigen Zügen alle zwölf Bildpaare zu finden, wobei nach dem Memory-Prinzip verfahren wird: Pro Runde werden zwei Karten aufgedeckt. Sind es die selben Motive, bleiben sie offen liegen, sind sie unterschiedlich, so werden sie zu Beginn einer neuen Runde wieder zugedeckt."));
		document.getElementById("description-content").appendChild(document.createElement("br"));
		document.getElementById("description-content").appendChild(document.createTextNode("Klicken Sie auf die Karten, um sie aufzudecken. Zum Beginn eines neuen Zuges klicken Sie einfach auf eine neue zugedeckte Karte, die offen liegenden Karten werden - sofern unterschiedlich - wieder zugedeckt. Sie können jedoch auch auf \"Neue Runde\" klicken, um erst die alten Karten wieder zuzudecken."));
		document.getElementById("description-content").appendChild(document.createElement("br"));
		document.getElementById("description-content").appendChild(document.createTextNode("Aber Vorsicht, viele der Motive sind sich auf den ersten Blick täuschend ähnlich. Hier kann es hilfreich sein, sich das Bild in Originalgröße anzugucken. Klicken Sie dazu einfach auf eine bereits aufgedeckte Karte."));
		document.getElementById("description-content").appendChild(document.createElement("br"));
		document.getElementById("description-content").appendChild(document.createTextNode("Viel Spaß bei der städtebaulichen Motivsuche!"));
		document.getElementById("description-content").appendChild(document.createElement("br"));
		var newElement = document.createElement("a");
		var newText = document.createTextNode("OK");
		newElement.appendChild(newText);
		document.getElementById("info-window-content").appendChild(newElement);
		document.getElementById("info-window-content").lastChild.href="javascript:hideInfoWindow()";
	}
}

function allPairsTurned() { // Funktion zum Anzeigen des Fensters für das Spielende
	blockGameLinks = 1;
	var newElement = document.createElement("p");
	var newText = document.createTextNode("Sie haben alle Paare aufgedeckt!");
	newElement.appendChild(newText);
	document.getElementById("info-window").appendChild(newElement);
	document.getElementById("info-window").firstChild.id="info-window-content";
	document.getElementById("info-window-content").style.top="158px";
	document.getElementById("info-window-content").appendChild(document.createElement("br"));
	document.getElementById("info-window-content").appendChild(document.createTextNode("Sie haben " + Round + " Runden gebraucht!"));
	document.getElementById("info-window-content").appendChild(document.createElement("br"));
	document.getElementById("info-window-content").appendChild(document.createTextNode("Es lohnt sich, mehrmals zu spielen, denn es werden immer nur 12 aus " + sumImages + " Bildern ausgewählt!"));

	document.getElementById("info-window-content").appendChild(document.createElement("br"));
	var newElement = document.createElement("a");
	var newText = document.createTextNode("OK");
	newElement.appendChild(newText);
	document.getElementById("info-window-content").appendChild(newElement);
	document.getElementById("info-window-content").lastChild.href="javascript:hideInfoWindow()";
	var newElement = document.createElement("a");
	var newText = document.createTextNode("Neues Spiel");
	newElement.appendChild(newText);
	document.getElementById("info-window-content").appendChild(newElement);
	document.getElementById("info-window-content").lastChild.href="javascript:prepareGame()";
}

function addRound() { // Funktion für das Aktualisieren der Runden-Anzeige
	Round = Round + 1;
	printText();
}

function printText() { // Text der Runden-Anzeige
	document.getElementById("counter").replaceChild(document.createTextNode(Round+" - "+turnedPairs+" von 12 Paaren aufgedeckt"), document.getElementById("counter").firstChild);
	
}