// Globale Konstanten

var nhFields  = 4;    // Anzahl Felder horizontal

var nvFields  = 4;    // Anzahl Felder vertikal

var nFields   = nhFields * nvFields; // Anzahl Felder insgesamt

var nFPairs   = nFields / 2;        // Anzahl Paare auf dem Feld

var nFWidth   = 104;  // Breite eines Feldes

var nFHeight  = 105;  // Hoehe eines Feldes

var sLogoPath = "memopix/deckblatt.png";



// Die Datenstruktur Pair enthaelt ein Paar von Daten, aus denen

// die zusammenpassenden Kartenpaare gebildet werden; bUsed

// wird benoetigt, um festzustellen, ob das Paar in dem Zuordnung

// schon verwendet wurde; alle Paerchen mit gleicher A-Karte

// erhalten den gleichen Index, sonst ist er verschieden.



function Pair( iIndex, A, B )

{

this.A = A;

this.B = B;

this.iIndex = iIndex;

this.bUsed = false;

}



// Tabelle mit den Paerchen



var aPairs = new Array(

new Pair(  1, '<img src=\"memopix/h0.jpg\" border=\"0\" height=\"105\" width=\"104\">','<img src=\"memopix/b0.jpg\" border=\"0\" height=\"105\" width=\"104\">' ),
new Pair(  2, '<img src=\"memopix/h1.jpg\" border=\"0\" height=\"105\" width=\"104\">','<img src=\"memopix/b1.jpg\" border=\"0\" height=\"105\" width=\"104\">' ),
new Pair(  3, '<img src=\"memopix/h2.jpg\" border=\"0\" height=\"105\" width=\"104\">','<img src=\"memopix/b2.jpg\" border=\"0\" height=\"105\" width=\"104\">' ),
new Pair(  4, '<img src=\"memopix/h3.jpg\" border=\"0\" height=\"105\" width=\"104\">','<img src=\"memopix/b3.jpg\" border=\"0\" height=\"105\" width=\"104\">' ),
new Pair(  5, '<img src=\"memopix/h4.jpg\" border=\"0\" height=\"105\" width=\"104\">','<img src=\"memopix/b4.jpg\" border=\"0\" height=\"105\" width=\"104\">' ),
new Pair(  6, '<img src=\"memopix/h5.jpg\" border=\"0\" height=\"105\" width=\"104\">','<img src=\"memopix/b5.jpg\" border=\"0\" height=\"105\" width=\"104\">' ),
new Pair(  7, '<img src=\"memopix/h6.jpg\" border=\"0\" height=\"105\" width=\"104\">','<img src=\"memopix/b6.jpg\" border=\"0\" height=\"105\" width=\"104\">' ),
new Pair(  8, '<img src=\"memopix/h7.jpg\" border=\"0\" height=\"105\" width=\"104\">','<img src=\"memopix/b7.jpg\" border=\"0\" height=\"105\" width=\"104\">' )

);



// Ausgabeformat fuer die Karten als CSS-Strings



var sFormatA = new String( '' );

var sFormatB = new String( '' );



// Zur Unterscheidung, welchen Code wir durchlaufen muessen
var startmemo = true;
var iDHTMLType = 0;
var isMSIE     = 1;
var isNetscape = 2;
var isDOM      = 3;

if( document.getElementById )
  {
  iDHTMLType = isDOM;
  }
else if( document.all )
  {
  iDHTMLType = isMSIE;
  }
else if( document.layers )
  {
  iDHTMLType = isNetscape;
  }
  
// Browser-abhaengige Konstanten (initialisiert fuer Netscape)

var nhOffset = 3;  // horizontaler Abstand zum linken Rand (LEFTMARGIN+x)
var nvOffset = 3;  // vertikaler Abstand zum oberen Rand (TOPMARGIN+x)
var nhSpace  = 6;   // horizontaler Abstand zwischen Feldern
var nvSpace  = 6;   // vertikaler Abstand zwischen Feldern

// Spiel-Status

var nOpen   = 0;    // Anzahl offener Karten
var nMoves  = 0;    // Anzahl Spielzuege
var nExtra  = 0;    // Anzahl unnoetiger Spielzuege
var nLeft   = nFPairs; // Anzahl noch zu findender Paare
var iCard   = new Array( 2 ); // Index der offenliegenden Karten

// Das Objekt Field enthaelt Informationen ueber die Felder des
// Zuordnungs-Spiels, alle Felder sind in dem Array aFields enthalten,
// Layer   wird bei Erstellung des Fensters bestimmt und enthaelt
//         einen Zeiger auf das LAYER- bzw. DIV-Objekt, mit dem 
//         dieses Feld abgedeckt wird.
// iPair   ist der Index in aPairs dieser Karte
// iType   ist entweder 1 oder 2 und bestimmt, ob die 1. oder 2.
//         Karte von aPairs[ iPair ] angezeigt wird.

function Field()
{
this.Layer = null;
this.iPair = -1;
this.iType = 0;
this.bSeen = false;
}

var aFields = new Array( nFields ); // Layer-Informationen
var wGame   = null; // Fenster, in dem das Spiel ablaeuft
var wCards  = null; // Fenster fuer die Anzeige der Karten
var bLoaded; // true, wenn sekundaeres Fenster geoeffnet

var nWWidth   = nhFields * ( nFWidth  + 10 );       // Breite des Spiel-Fensters
var nWHeight  = nvFields * ( nFHeight + 10 ) + 60;  // Hoehe des Spiel-Fensters
var nPairs = aPairs.length; // Anzahl moegliche Paare

var sFormatA1 = '';
var sFormatA2 = '';
var sFormatB1 = '';
var sFormatB2 = '';

// Preload Images (performance considerations)

{
var oImage = new Image();
oImage.src = sLogoPath;

var sSrc = new String();
var sPat = /^<img.*src=\"([^\"]*).*$/i;

for( var i = 0; i < aPairs.length; i++ )
  {
  sSrc = aPairs[i].A;
  if( sSrc.charAt(0) == "<" ){ oImage.src = sSrc.replace( sPat, "$1" ); }
  sSrc = aPairs[i].B;
  if( sSrc.charAt(0) == "<" ){ oImage.src = sSrc.replace( sPat, "$1" ); }
  }
}

// Mit der Funktion Match wird bestimmt, ob die beiden Karten
// auf den Feldern F1 und F2 (vom Typ Field) zusammenpassen

function Match( F1, F2 )
{
if( F1.iType == F2.iType )
  {
  return false;
  }
if( aPairs[ F1.iPair ].iIndex != aPairs[ F2.iPair ].iIndex )
  {
  return false;
  }
return true;
}

// OnLoad fuehrt einmalige Initialisierungen durch, diese
// Routine wird beim Laden der Seite mit dem Spiel einmalig
// aufgerufen

function OnLoadMemo()
{
if( iDHTMLType == isMSIE )
  {
  nhOffset += 1;
  nvOffset += 1;
  }
else if( iDHTMLType == isNetscape )
  {
  }
else if( iDHTMLType == isDOM )
  {
  }
else
  {
  alert( 'Unbekannter Browser-Typ - bitte an den Autor melden!' );
  }
// Anlegen des Arrays aFields mit Field-Objekten

var i;
for( i = 0; i < nFields; i++ )
  {
  aFields[i] = new Field();
  }
  
// Ausgabeformat

if( sFormatA.length > 0 )
  {
  sFormatA1 = '<p class="CardA">';
  sFormatA2 = '</p>';
  }
if( sFormatB.length > 0 )
  {
  sFormatB1 = '<p class="CardB">';
  sFormatB2 = '</p>';
  }
 
}

// gibt eine Zufallszahl zwischen 0 und (n-1) zurueck

function GetInt( n )
{
return Math.ceil( Math.random() * n ) - 1;
}

// Start initalisiert ein neues Spiel und erstellt in dem
// Fenster wGame das Zuordnung-Spiel

function Start()
{
Math.floor( nFPairs );

// Zur Sicherheit ...

if( nPairs < nFPairs ){ alert( 'Es gibt zu wenig moegliche Paare!\nBitte an die Systembetreuung wenden!' ); }
if( Math.floor( nFPairs ) != nFPairs ){ alert('Ungerade Anzahl von Karten!\nBitte an die Systembetreuung wenden!' ); }

// Initialisierung

nOpen  = 0; // keine Karten liegen offen
nMoves = 0; // noch keine Spielzuege durchgefuehrt
nExtra = 0;
nLeft  = nFPairs; // alle Paare muessen noch gefunden werden

// Setze alle moeglichen Paare auf den Status 'unbenutzt'

var i;
for( i = 0; i < nPairs; i++ )
  {
  aPairs[i].bUsed = false;
  }

// Loesche alle Eintragungen im Array aFields
  
for( i = 0; i < nFields; i++ )
  {
  aFields[i].Layer = null;
  aFields[i].iPair = -1;
  aFields[i].iType = 0;
  aFields[i].bSeen = false;
  }

// Bestimmte die Karten, mit denen gespielt werden soll:
// Dazu wird eine zufaellige Zahl n zwischen 0 und der Anzahl
// der noch nicht verwendeten Karten gezogen und die n-te,
// noch nicht verwendete Karte gewaehlt.

var aCards = new Array( nFPairs );
i = nFPairs;

while( i > 0 )
  {
  var j = GetInt( nPairs );
  if( !aPairs[ j ].bUsed )
    {
    i--;
    aCards[ i ] = j;
    aPairs[ j ].bUsed = true;
    }
  }

// Karten auf Felder verteilen

i = nFields;
var iPair = 0;
var iType = 1;

while( i > 0 )
  {
  var j = GetInt( i );
  var k;
  for( k = 0; k < nFields; k++ )
    {
    if( aFields[ k ].iPair == -1 )
      {
      if( j <= 0 )
        {
        i--;
        aFields[k].iPair = aCards[ iPair ];
        aFields[k].iType = iType;
        if( iType == 2 )
          {
          iPair++;
          iType = 1;
          }
        else
          {
          iType = 2;
          }
        break;
        }
      j--;
      }
    }
  }
  
// Neues Fenster erstellen
  
//var sParams = 'width=' + nWWidth + ',height=' + nWHeight;
bLoaded = true;
//wGame = window.open('memowait.html','Zuordnungspiel',sParams);
wGameDiv = document.getElementById("MemoGame");
 GameInit();
}
function InitLayer( i )
{
with( wGameDiv )
  {
    {
    if( iDHTMLType == isNetscape )
      {
      aFields[ i ].Layer = layers[ i ];
      }
    else if( iDHTMLType == isMSIE )
      {
      aFields[ i ].Layer = all.tags( 'DIV' )[ i ];
      }
    else if( iDHTMLType == isDOM )
      {
      aFields[ i ].Layer = document.getElementById( 'l' + i );
      }
    }
  }
}
// OnClick
//
// Wenn zwei nicht passende Karten offenliegen,
//   drehe diese Karten wieder um
// Wenn noch keine Karte aufgedeckt wurde,
//   dann decke die angeklickte Karte auf
// Sonst Wenn schon eine Karte aufgedeckt liegt
//   dann decke die angeklickte Karte auf
//   finde heraus, ob beide Karten passen
//   Wenn die letzten beiden Karten aufgedeckt sind
//     beende das Spiel

function OnClick( i )
{

if( aFields[i].Layer == null )
  {
  InitLayer(i);
  }
  
if( nOpen == 2)
  {
  Show( iCard[0], false );
  Show( iCard[1], false );
  nOpen = 0;
  }
  
Show( i, true );
iCard[nOpen] = i;
nOpen++;

if( nOpen == 2 )
  {
  nMoves++;
  if( Match( aFields[iCard[0]], aFields[iCard[1]] ))
    {
    nOpen = 0;
    nLeft--;
    if( nLeft == 0 )
      {
      stoppen();
	  
        document.memoform.seconds.value = seconds;
        document.memoform.moves.value = nMoves;
        try {
		document.memoform.onsubmit();
		}
		catch(e){}
		document.memoform.submit();
		//close();
      }
    }
  else // pruefen, ob Karten schon mal aufgelegt wurden
    {
    if( aFields[iCard[0]].bSeen || aFields[iCard[1]].bSeen )
      {
      nExtra++;
      }
    else
      {
      var j;
      for( j = 0; j < nFields; j++ )
        {
        if( j != iCard[0] && j != iCard[1] )
          {
          if( Match( aFields[iCard[0]], aFields[j] ) && aFields[j].bSeen )
            {
            nExtra++;
            break;
            }
          }
        }
      }
    aFields[iCard[0]].bSeen = true;
    aFields[iCard[1]].bSeen = true;
    }
  }
}

// Show zeigt den Inhalt des Feldes an, indem der Layer
// versteckt (show/visible) wird

function Show( i, bShow )
{
if( iDHTMLType == isNetscape )
  {
  aFields[i].Layer.visibility = bShow ? 'hide' : 'show' ;
  }
else if( iDHTMLType == isMSIE )
  {
  aFields[i].Layer.style.setAttribute( 'visibility', bShow ? 'hidden' : 'visible', 'true' );
  }
else if( iDHTMLType == isDOM )
  {
  aFields[i].Layer.style.visibility = bShow ? 'hidden' : 'visible';
  }
}

// ShowAll erstellt ein Fenster mit alle zusammengehoerigen Karten

function ShowAll()
{
var nWidth = 2 * ( nFWidth + 30 ) + 15; // Breite des Fensters
bLoaded = false;
wCards = window.open('memowait.html','Cards','width='+nWidth+',height=500,scrollbars=yes');
ShowInit();
}

function GameInit()
{
if( !bLoaded )
  {
  setTimeout( "GameInit()",500);
  return;
  }
//var sHREF = wGame.location.href;
with( wGameDiv )
{
//open();
// Header

/*writeln(
 '<base href="' + sHREF + '">\n',
 '<meta http-equiv="Content-Type" content="text/html;CHARSET=iso-8859-1">\n',
 '<link href="styles/central_draft.css" rel="stylesheet" type="text/css" />',
 '<style type="text/css">');
if( sFormatA.length > 0 )
  {
  writeln('P.CardA{' + sFormatA + '}');
  }
if( sFormatB.length > 0 )
  {
  writeln('P.CardB{' + sFormatB + '}');
  }
writeln('</style>',
 '<title>Zuordnung-Spiel</title>\n</head>\n',
 '<body leftmargin="10" topmargin="10">' );
*/
// Layer und deren Position feststellen
 
var iCol = nhFields;
var iLeft = 0;
var iTop  = nvOffset - nvSpace - nFHeight;
var ausgabe = '';
for( i = 0; i < nFields; i++ )
  {
  if( iCol == nhFields  )
    {
    iLeft = nhOffset;
    iTop += nvSpace + nFHeight;
    iCol = 1;
    }
  else
    {
    iLeft += nhSpace + nFWidth;
    iCol++;
    }
  ausgabe += '<div id=\"l' + i + '\" style=\"Position:absolute;Width:' + nFWidth + 'px;Height:' + nFHeight + 'px;Top:' + iTop + 'px;Left:' + iLeft + 'px\"><layer><a href=\"javascript:OnClick(' + i + ')\"><img src=\"' + sLogoPath + '\" border=\"0\" height=\"' + nFHeight + '\" width=\"' + nFWidth + '\"></a></layer></div>' ;
  }

// Tabelle mit den Karten-Inhalten erstellen
  
ausgabe +=  '<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\" id=\"MemoTab\">' ;

iCol = 1;
for( i = 0; i < nFields; i++ )
  {
  if( iCol == 1 )
    {
    ausgabe+= "<tr align='center'>";
    }
  ausgabe+="<td width='" + nFWidth + "' height='" + nFHeight + "'>";
  
  with( aFields[i] )
    {
    if( iType == 1 )
      {
      //ausgabe+= sFormatA1 + aPairs[ iPair ].A + sFormatA2 ;
      ausgabe+= aPairs[ iPair ].A;
      }
    else
      {
      //ausgabe+= sFormatB1 + aPairs[ iPair ].B + sFormatB2 ;
      ausgabe+= aPairs[ iPair ].B;
      }
    }
  ausgabe+='</td>';

  if( iCol == nhFields )
    {
    ausgabe+='</tr>' ;
    iCol = 1;
    }
  else
    {
    iCol++;
    }
  }

ausgabe+=
 "</table><br><p><b>Zeit: <span id=\"counttimer\">0 Sekunden</span></b></p><form action=\"memo.php\" method=\"POST\" name=\"memoform\"><input type=\"hidden\" name=\"seconds\" value=\"\"><input type=\"hidden\" name=\"moves\" value=\"\"></form>";
 innerHTML = ausgabe;
 starten();
//close();
}
}
function ShowInit()
{
if( !bLoaded )
  {
  setTimeout( "ShowInit()",500);
  return;
  }
  
var sHREF = wCards.location.href;
with( wCards.document )
{
open();

// Header

writeln(
  '<base href="' + sHREF + '">\n',
  '<meta http-equiv="Content-Type" content="text/html;CHARSET=utf-8">\n',
  '<link href="styles/central_draft.css" rel="stylesheet" type="text/css" />\n',
  '<style type="text/css">');
if( sFormatA.length > 0 )
  {
  writeln('P.CardA{' + sFormatA + '}');
  }
if( sFormatB.length > 0 )
  {
  writeln('P.CardB{' + sFormatB + '}');
  }
writeln(
  '</style><title>Memo-Spiel</title></head>\n',
  '<body leftmargin="10" topmargin="10">\n',
  '<table border="0" cellspacing="5" cellpadding="0">' );

var i;
for( i = 0; i < aPairs.length; i++ )
  {
  writeln( '<tr><td align="right" valign="top"><p class="CardA">' + aPairs[i].A + '</p></td><td>&nbsp;</td>',
           '<td valign="top"><p class="CardB">' + aPairs[i].B + '</p></td></tr>' );
  }
writeln( '</table></body></html>');
close();
}
}

//Zeitzähler
var seconds = 0;
function counttime()
{
	seconds = seconds +1;
        document.getElementById('counttimer').innerHTML = seconds + ' Sekunden';
}
function starten() {
	seconds = 0;
	aktiv = window.setInterval("counttime()",1000);
	//document.getElementByID('counttimer').style.visibility = visible;
}
function stoppen() {
	window.clearInterval(aktiv);
}
	//document.getElementByID('countbox').style.visibility = visible;

