/* 
	Copyright © 2005-2008, Werner Freytag. All rights reserved. 
	http://www.power4mac.com
	
	History:
	2008-02-02: Doesn't always scroll to bottom
	2007-20-24: First release
*/

var numrows = 10;

var numcolumns = 4;
var numcolors = 5 ;

var mouseDowncolumn = -1;
var dragcolor = -1;

var board = [];
var secretCode = [];

var activeRow = 0;

function rotateToken(row, col)
{
	if (row!=activeRow || row>numrows || col>numcolumns)
		return;
	
	var e = window.event;
	var backwards = e.wheelDelta > 1
		|| (e.type && e.type == "contextmenu") || (e.button && e.button == 2) || (e.which && e.which == 3)
		|| e.shiftKey || e.altKey || e.ctrlKey || e.metaKey;
	
	// rotate color
	var color = board[row-1][col-1];
	
	if (backwards) {
		color--;
		if (color < 0 )
			color = numcolors;
	}
	else {
		color++;
		if (color > numcolors)
			color = 0;
	}

	setColor( row, col, color, true );
}

function setColor( row, col, color, updateVar )
{
	var img = document.getElementById( 'token_' + row + '_' + col );
	img.src = 'Images/Tokens/' + color + '.png';
	
	var e = window.event;
	e.stopPropagation();
	e.preventDefault();

	if (updateVar) {
		board[row-1][col-1] = color;
        setOkButtonEnabled();
	}
}

function getColor( row, col )
{
	return board[row-1][col-1];
}

function setPointer( obj, active )
{
	obj.style.cursor = active ? 'pointer' : 'default';
}

function mouseDown( row, col )
{
	mousedowncolumn = activeRow==row ? col : -1;
}

function mouseUp( row, col )
{
	if (activeRow==row && mousedowncolumn==col)
		rotateToken( row, col );
}

function mouseOver( img, row )
{
	if (activeRow==row)
		setPointer(img, 1);
}

function mouseOut( img )
{
	setPointer( img, 0);
}

function okClick()
{
	if ( !allTokensSetInActiveRow() )
		return;
	
	activeRow++;
	if (activeRow>numrows)
		discoverCover();
	
	drawBoard();
}

function allTokensSetInActiveRow()
{
	if (!activeRow)
		return;
	
	var allSet = true;
	for ( i=0; i<numcolumns; ++i )
		allSet &= board[activeRow-1][i] > 0;
	return allSet;
}

function scrollDown()
{
    if ( 595 - window.innerHeight <= document.body.scrollTop )
        return;
    window.scrollBy(0, 10);
    setTimeout("scrollDown()", 10);
}

function newGame()
{
	document.getElementById('message').style.display = 'none';
	document.getElementById('cover').style.display = 'block';
	document.getElementById('OkButton').style.display = 'none';
	
	for ( i = 0; i<numcolumns; ++i )
		secretCode[i] = ( (new Date).getMilliseconds() + Math.round( Math.random() * numcolors ) ) % numcolors + 1;
	
	for ( row=0; row<numrows; ++row ) {
		var rowArray = [];
		for ( col=0; col<numcolumns; ++col )
			rowArray[col] = 0;
		board[row] = rowArray;
	}
	
	activeRow = 1;
	
//    scrollDown();
    
	drawBoard();
	document.getElementById('OkButton').style.display = 'block';
}

function setOkButtonEnabled()
{
    var enabled            = allTokensSetInActiveRow();

    var div                = document.getElementById('OkButton');
    div.style.background   = enabled ? "url(Images/OkButton.png)" : "url(Images/OkButton_disabled.png)";
    div.onclick            = enabled ? okClick : function() {};
    div.style.cursor       = enabled ? 'pointer' : '';
}

function setupBoard()
{
	document.getElementById('secretCode').innerHTML = '';
	document.getElementById('trials').innerHTML = '';
	
	var div = document.getElementById('NewGameButton');
	div.innerHTML   = getLocalizedString('New Game');
	div.onclick     = newGame;
    
    setOkButtonEnabled();
    	
	var left = 30 * numcolumns + 8 * Math.ceil( numcolumns / 2 ) + 60 + 'px';
	
	// Board
	var innerHTML = '';
	innerHTML += '<table cellpadding="0" cellspacing="0">';
	innerHTML += '<tr>';
	for ( col=1; col<=numcolumns; ++col )
		innerHTML += '<td class="token"><img src="Images/Tokens/0.png"/></td>';
	innerHTML += '</tr>';
	innerHTML +='</table>';
	document.getElementById('secretCode').innerHTML = innerHTML;
	
	var innerHTML = '<table cellpadding="0" cellspacing="0" id="main_table">';
	for ( row=numrows; row>0; --row ) {
		innerHTML += '<tr id="row_' + row + '">';
		innerHTML += '<td class="number">' + row + '</td>';
		for ( col=1; col<=numcolumns; ++col )
			innerHTML += '<td class="token"><img src="Images/Tokens/0.png" id="token_' + row + '_' + col + '"'
				 + ' oncontextmenu="rotateToken(' + row + ',' + col + ')"'
				 + ' onmousewheel="rotateToken(' + row + ',' + col + ')"'
				 + ' onmousedown="mouseDown(' + row + ',' + col + ')"'
				 + ' onmouseup="mouseUp(' + row + ',' + col + ')"'
				 + ' ondragstart="return dragStart(' + row + ',' + col + ')"'
				 + ' ondragover="dragOver(' + row + ',' + col + ')"'
				 + ' ondragleave="dragLeave(' + row + ',' + col + ')"'
				 + ' ondrop="drop(' + row + ',' + col + ')"'
				 + ' onmouseover="mouseOver(this, ' + row + ')"'
				 + ' onmouseout="mouseOut(this)"'
				 + ' style="-khtml-user-drag:element;"'
				 + '/></td>';
		innerHTML += '<td class="rating" align="center">';
		for ( y=0; y<2; ++y ) {
			innerHTML += '<table cellpadding="0" cellspacing="0"><tr>';
			for ( x=0; x < Math.ceil( numcolumns / 2 ); ++x ) {
				if ( y * Math.ceil( numcolumns / 2 ) + x < numcolumns ) {
					innerHTML += '<td>';
					innerHTML += '<img src="Images/PinNone.png" class="pin" name="pin"/>';
					innerHTML += '</td>';
				}
			}
			innerHTML +='</tr></table>';
		}
		innerHTML += '</td>';
		innerHTML += '</tr>';
	}
	innerHTML += '</table>';
	document.getElementById('trials').innerHTML = innerHTML;

	/* Preload Images */
	var images = ['Board', 'Cover', 'OkButton', 'OkButton_disabled', 'PinBlack', 'PinNone', 'PinWhite',
		'Tokens/0', 'Tokens/1', 'Tokens/2', 'Tokens/3', 'Tokens/4', 'Tokens/5', 'Tokens/6'];

	var img = new Array(20);
	var i = 0;
	for ( image in images ) {
		img[i] = new Image();
		img[i].src = 'Images/' + image + '.png';
		i++;
	}

	/* Welcome message */
	var message = document.getElementById('message');

	message.innerHTML = getLocalizedString( 'Welcome to SuperBrain!' );
	message.style.display = 'block';
	message.style.top = '10px';
}

function drawBoard()
{
	var imgs = document.getElementById('secretCode').getElementsByTagName('img');
	var pins = document.getElementsByName('pin');
	
	// display board pins
	for ( col = 0; col<numcolumns; ++col )
		imgs[col].src = 'Images/Tokens/' + secretCode[col] + '.png';
	
	// Pins
	for ( row = numrows; row>0; --row ) {
		
		var theRow = document.getElementById('row_' + row);
		
		// display board pins
		for ( col = 1; col<=numcolumns; ++col ) {
			var img = document.getElementById( 'token_' + row + '_' + col );
			img.src = img.src = 'Images/Tokens/' + board[row-1][col-1] + '.png';
			img.style['-apple-dashboard-region'] = row<=activeRow ? 'dashboard-region(control circle 0 0 0 0)' : '';
		}
	}

	// Rating
	for ( row = numrows; row>0; --row ) {
		
		var theRow = document.getElementById('row_' + row);

		var blacks = 0;
		var whites = 0;
		
		var secretRow = [];
		var trialRow = [];
		
		// rate only when all columns are filled
		var allSet = true;
		for ( i=0; i<numcolumns; ++i )
			allSet &= board[row-1][i] > 0;

		if (allSet) {
			for ( col = 0; col<numcolumns; ++col ) {
				
				trialColor = board[row-1][col];
				secretColor = secretCode[col];
				
				if (trialColor==secretColor)
					blacks++;
				
				else {
					secretRow.push( secretColor );
					trialRow.push( trialColor );
				}
			}
			
			for ( i=0; i<secretRow.length; ++i ) {
				for ( j=0; j<trialRow.length; ++j ) {
					if (secretRow[i]!=false && secretRow[i]==trialRow[j]) {
						whites++;
						secretRow[i] = false;
						trialRow[j] = false;
						break;
					}
				}
			}

			// Gewonnen!
			if ( blacks == numcolumns ) {
	
				var message = document.getElementById('message');
				
				message.innerHTML = getLocalizedString( 'Congratulations!<br>You\'ve found the secret code!' );
				message.style.display = 'block';
				message.style.top = ( ( 10 - activeRow ) * 48 + 100 ) + 'px';

				discoverCover();
			}
		}
		
		// display rating
		for ( i = 0; i < numcolumns; ++i ) {
			if (blacks>0) {
				pins[(10-row) * numcolumns + i].src = 'Images/PinBlack.png';
				blacks--;
			}
			else if (whites>0) {
				pins[(10-row) * numcolumns + i].src = 'Images/PinWhite.png';
				whites--;
			}
			else {
				pins[(10-row) * numcolumns + i].src = 'Images/PinNone.png';
			}
		}
	}
	
	// Numbers
	for ( row = numrows; row>0; --row ) {
		var theRow = document.getElementById('row_' + row);
		var number = theRow.getElementsByTagName('td')[0];
		number.className = row==activeRow ? 'number active' : 'number';
	}

    setOkButtonEnabled();
    
	var div = document.getElementById( 'OkButton' );
	div.style.top = ( 80 + ( 10 - activeRow ) * 48 ) + 'px';
	div.style.display = activeRow ? 'block' : 'none';
}

function discoverCover()
{
	document.getElementById('cover').style.display = 'none';
	activeRow = 0;
}

function getLocalizedString (key)
{
	try {
		var ret = localizedStrings[key];
		if (ret === undefined)
			ret = key;
		return ret;
	} catch (ex) {}

	return key;
}