<!--
	/*
		Copyright 2008 Egmont Serieforlaget AS

		Developed by Escio AS - http://www.escio.no/
	*/
	function eSudoku_Display(ePuzzle, eSudoku) {
		this.ePuzzle = ePuzzle;

		this.eSudoku = eSudoku;
		this.eSudoku.painter = this;

		this.ePuzzle.initPuzzleArea();

		this.eSudokuTable = document.createElement('table');

		this.height	= 700;
		this.width	= 700;

		this.numberCells = [];
		Element.extend(this.numberCells);

		this.initSudokuElement = function() {
			var baseId = this.ePuzzle.puzzleContainer;

			this.eSudokuTable.id = baseId + '_sudoku';

			this.ePuzzle.puzzleArea.appendChild(this.eSudokuTable);
		}

		this.buildSudoku = function() {
			var sudoku	= this.eSudoku.sudoku;
			var baseId	= this.ePuzzle.puzzleContainer;

			$(baseId+'_sudoku').setStyle({verticalAlign: 'top'});

			// Build table
			var grid	= sudoku.grid;

			if(sudoku.dimensions) {
				var dimensions = sudoku.dimensions;
				this.width	= dimensions.width;
				this.height	= dimensions.height;
			}

			this.cellWidth	= (this.width/grid[0])-3;
			this.cellHeight	= (this.height/grid[1])-3;

			if(this.totalWidth || this.totalHeight) {
				if(this.totalHeight) $(baseId+'_wrapper').setStyle({height: this.totalHeight + 'px'});

				if(this.totalWidth) {
					$(baseId+'_wrapper').setStyle({width: this.totalWidth + 'px'});
				}

				$(baseId+'_wrapper').setStyle({overflow: 'hidden'});
			}

			// Center play area horizontally
			$(baseId+'_puzzlearea').setStyle({textAlign: 'center'});
			$(baseId+'_sudoku').setStyle({margin: 'auto'});

			// Calculate sizes based on size of play area
			this.sizeFactor	= (this.cellHeight > this.cellWidth) ? this.cellWidth : this.cellHeight;
			this.letterSize	= Math.round((this.sizeFactor/4)*2.3);
			this.padding	= Math.round((this.sizeFactor/4)*0.7);

			var tBody = document.createElement('tbody');
			this.eSudokuTable.appendChild(tBody);
			this.eSudokuTable.style.width			= this.width + 'px';
			this.eSudokuTable.style.height			= this.height + 'px';
			this.eSudokuTable.style.borderColor		= 'black';
			this.eSudokuTable.style.borderWidth		= '1px';
			this.eSudokuTable.style.borderStyle		= 'solid';
			this.eSudokuTable.style.borderCollapse	= 'collapse';

			// BUILD eSudoku TABLE DEFINED BY grid
			for(tableY = 0; tableY < grid[1]; tableY++) {
				eSudokuTableRow = tBody.insertRow(tBody.rows.length);
				eSudokuTableRow.style.borderWidth = '0px';

				for(tableX = 0; tableX < grid[0]; tableX++) {
					var cellNumber = ((tableY*grid[0])+tableX);

					var eSudokuTableCell = eSudokuTableRow.insertCell(eSudokuTableRow.cells.length);
					eSudokuTableCell.id = baseId + '_cell_' + cellNumber;
					eSudokuTableCell.style.background		= '#707070';
					eSudokuTableCell.style.width			= this.cellWidth + 'px';
					eSudokuTableCell.style.height			= this.cellHeight + 'px';
					eSudokuTableCell.style.textAlign		= 'left';
					eSudokuTableCell.style.verticalAlign	= 'top';

					if(sudoku.cells[cellNumber+1]) {
						var cell = sudoku.cells[cellNumber+1];
						if(cell['color']) {
							eSudokuTableCell.definedColor = cell['color'];
							eSudokuTableCell.style.background = cell['color'];
						}
					}
				}
			}

			currentSudoku = this;
			sudoku.cells.each(function(cell, index) {
				currentSudoku.buildSudokuCell(cell, index)
			});

			sudoku.cells.each(function(cell, index) {
				currentSudoku.setInputValue(cell, index)
			});

			$(baseId+'_loader').setStyle({display: 'none'});
			$(baseId).setStyle({visibility: 'visible'});
		}

		this.isComplete = function() {
			var complete = true;
			this.numberCells.each(function(cell) {
				if(cell.value.replace(/\s*/,'') == '') complete = false;
			},this);

			return complete;
		}

		this.buildSudokuCell = function(cellDefinition, index) {
			var baseId	= this.ePuzzle.puzzleContainer;
			var sudoku	= this.eSudoku.sudoku;
			var grid	= sudoku.grid;

			var cellId = baseId + '_cell_' + index;
			var cell = $(cellId);

			var cellInput = document.createElement('input');

			this.numberCells.push(cellInput);

			cellInput.id = cellId + '_input';

			cell.appendChild(cellInput);

			$(cellId+'_input').setStyle({
				position:		'absolute',
				background:		'none',
				borderWidth:	'0px',
				textAlign:		'center',
				fontFamily: 	'Arial',
				fontSize:		this.letterSize + 'px',
				fontWeight:		'bold',
				color:			'#135EC1',
				textTransform:	'uppercase',
				padding:		this.padding + 'px 0px 0px 0px',
				width:			cell.style.width,
				height:			cell.style.height
			});

			var cellColor = '#FAFAFA';
			if($(cellId).definedColor) {
				var cellColor = $(cellId).definedColor;
			}

			$(cellId).setStyle({
				background:		cellColor,
				borderColor:	'black',
				borderWidth:	'1px',
				borderStyle:	'solid'
			});

			if(cellDefinition[4] == 'true') {
				$(cellId).setStyle({
					borderTopWidth: '3px'
				});
			}

			if(cellDefinition[5] == 'true') {
				$(cellId).setStyle({
					borderLeftWidth: '3px'
				});
			}

			if(cellDefinition[3] == 'true') {
				var cellClue = document.createElement('div');
				cellClue.id = cellId + '_clue';
				cell.appendChild(cellClue);

				$(cellId+'_clue').setStyle({
					position:		'absolute',
					background:		'none',
					borderWidth:	'0px',
					textAlign:		'center',
					fontFamily: 	'Arial',
					fontSize:		this.letterSize + 'px',
					fontWeight:		'bold',
					textTransform:	'uppercase',
					padding:		this.padding + 'px 0px 0px 0px',
					width:			cell.style.width,
					height:			cell.style.height
				});

				$(cellId+'_clue').innerHTML	= cellDefinition[2];

				$(cellId+'_input').setStyle({
					display:		'none'
				});
			} else {
				Event.observe(cellId+'_input','click',this.eSudoku.eventListener.bindAsEventListener(this.eSudoku));
				Event.observe(cellId+'_input','keypress',this.eSudoku.eventListener.bindAsEventListener(this.eSudoku));
				Event.observe(cellId+'_input','keyup',this.eSudoku.eventListener.bindAsEventListener(this.eSudoku));
			}
		}

		this.setInputValue = function(cellDefinition, cellNumber) {
			var baseId	= this.ePuzzle.puzzleContainer;
			var sudoku = this.eSudoku.sudoku;
			var grid = sudoku.grid;

			var cellId = baseId + '_cell_' + cellNumber;

			if(cellDefinition[3] == 'true') {
				$(cellId+'_input').value = cellDefinition[2];
			}
		}

		this.getValue = function(cellNumber) {
			var baseId	= this.ePuzzle.puzzleContainer;
			var cellId = baseId + '_cell_' + cellNumber + '_input';

			return $(cellId).value;
		}

		this.setValue = function(cellNumber, value) {
			var baseId	= this.ePuzzle.puzzleContainer;
			var cellId = baseId + '_cell_' + cellNumber + '_input';

			$(cellId).value = value;
		}

		this.focusCaret = function() {
			var selectedCell = this.eSudoku.selectedCell;

			if(selectedCell) selectedCell.focus();
		}

		this.highLightCell = function(cellNumber) {
			var baseId	= this.ePuzzle.puzzleContainer;
			var cellId = baseId + '_cell_' + cellNumber;

			$(cellId).setStyle({
				background:	'#EE8B04'
			});
		}

		this.dimCell = function(cellNumber) {
			var baseId	= this.ePuzzle.puzzleContainer;
			var cellId = baseId + '_cell_' + cellNumber;

			var cellColor = '#FAFAFA';
			if($(cellId).definedColor) {
				var cellColor = $(cellId).definedColor;
			}

			$(cellId).setStyle({
				background:		cellColor
			});
		}

		this.selectCell = function(conflictCell) {
			var selectedCell = this.eSudoku.selectedCell;

			if(conflictCell) {
				$(selectedCell.id).up().setStyle({
					background:		'#E6CAAE'
				});
			} else {
				$(selectedCell.id).up().setStyle({
					background:		'#ADD8E6'
				});
			}

			if(eSudoku.sudoku.userId) {
				if(this.eSudoku.sudoku.actions.solve) this.ePuzzle.enableButton('solveCellButton');
			}
		}

		this.deSelectCell = function() {
			var selectedCell = this.eSudoku.selectedCell;

			if(selectedCell) {
				var cellColor = '#FAFAFA';
				if($(selectedCell.id).up().definedColor) {
					var cellColor = $(selectedCell.id).up().definedColor;
				}

				$(selectedCell.id).up().setStyle({
					background:		cellColor
				});
			}
		}

		this.newState = function() {
			/*
			if(this.eSudoku.state == 'IDLE')		this.eSudokuStatus.innerHTML = 'Venter...';
			if(this.eSudoku.state == 'INIT')		this.eSudokuStatus.innerHTML = 'Initialiserer...';
			if(this.eSudoku.state == 'BUILD')	this.eSudokuStatus.innerHTML = 'Bygger sudoku...';

			if(this.eSudoku.state == 'ERROR') {
				this.eSudokuStatus.innerHTML = 'FEIL:<br/>'+this.eSudoku.errorMessage;
			}
			*/


			var stateMessage = '';
			if(this.eSudoku.state == 'IDLE') {
				stateMessage = this.eSudoku.stateMessage;
			}

			if(this.eSudoku.state == 'ERROR') {
				stateMessage = 'FEIL:<br/>'+this.eSudoku.errorMessage;
			}

			try {
				var baseId = 'eSudoku_' + this.eSudoku.id;
				var sudoku = this.eSudoku.sudoku;

				var statusPane = $(baseId+'_statusPane');
				if(statusPane) {
					$(baseId+'_statusPane').innerHTML = '';
					if(sudoku.userId) {
						if(this.eSudoku.saveState == 'CHANGED') {
							if(this.eSudoku.sudoku.actions.save) if(this.ePuzzle.enableButton('saveButton')) this.focusCaret();
						} else {
							if(this.ePuzzle.disableButton('saveButton')) this.focusCaret();
						}
					}
				}

				if(sudoku) {
/*					var newStateMessage = '';

					if(sudoku.startTs > 0) {
						newStateMessage += 'Påbegynt: ' + tsToDate(sudoku.startTs);
						newStateMessage += '<BR>';
					}

					if(this.eSudoku.puzzleMode == 'SOLVED') {
						newStateMessage += 'Innlevert: ' + tsToDate(sudoku.endTs) + '<BR>';
						newStateMessage += 'Poeng: ' + sudoku.score;

					 	if($(baseId+'_submitButton').enabled) {
						 	$(baseId+'_submitButton').disable();
						 	$(baseId+'_submitButton').className = 'button submitButtonDisabled';
					 	}
					 	if($(baseId+'_solveButton').disabled) {
							$(baseId+'_solveButton').enable();
							$(baseId+'_solveButton').className = 'button solveButton';
					 	}
					} else {
						newStateMessage += '<BR>';
						newStateMessage += stateMessage;

						if(sudoku.userId) {
						 	if($(baseId+'_submitButton').disabled) {
								$(baseId+'_submitButton').enable();
								$(baseId+'_submitButton').className = 'button submitButton';
						 	}
						 	if($(baseId+'_solveButton').disabled) {
								$(baseId+'_solveButton').enable();
								$(baseId+'_solveButton').className = 'button solveButton';
						 	}
						} else {
						 	if($(baseId+'_submitButton').enabled) {
								$(baseId+'_submitButton').disable();
								$(baseId+'_submitButton').className = 'button submitButtonDisabled';
						 	}
						 	if($(baseId+'_solveButton').enabled) {
								$(baseId+'_solveButton').disable();
								$(baseId+'_solveButton').className = 'button solveButtonDisabled';
						 	}
						}
					}

					if($(baseId+'_statusPane').innerHTML != newStateMessage) {
						$(baseId+'_statusPane').innerHTML = newStateMessage;
					}*/

					var stateMessage = '';

					var baseId = this.ePuzzle.puzzleContainer;

					if(this.eSudoku.state == 'IDLE') {
						$(baseId+'_loader').setStyle({display: 'none'});
						$(baseId).setStyle({display: 'block'});

						stateMessage += this.eSudoku.stateMessage;
					}

					if(this.eSudoku.state == 'ERROR') {
						$(baseId+'_loader').setStyle({display: 'none'});
						$(baseId).setStyle({display: 'block'});

						stateMessage += 'FEIL:<br/>'+this.eSudoku.errorMessage;
					}

					if(this.eSudoku.sudoku && (this.eSudoku.sudoku.userId > 0)) {
						if(this.eSudoku.saveState == 'CHANGED') {
							if(this.eSudoku.sudoku.actions.save) if(this.ePuzzle.enableButton('saveButton')) this.focusCaret();
						} else {
							if(this.ePuzzle.disableButton('saveButton')) this.focusCaret();
						}

						if(this.eSudoku.sudoku.actions.solve) this.ePuzzle.enableButton('solveButton');

						if(this.eSudoku.sudoku.startTs > 0) {
							stateMessage += 'Påbegynt: ' + tsToDate(this.eSudoku.sudoku.startTs);
							stateMessage += '<br>';
						}

						if(this.eSudoku.sudoku.endTs > 0) {
							stateMessage += 'Innlevert: ' + tsToDate(this.eSudoku.sudoku.endTs) + '<br>';
						 	stateMessage += 'Poeng: ' + this.eSudoku.sudoku.score;

							this.ePuzzle.disableButton('submitButton');
						} else {
							if((this.eSudoku.state == 'COMPLETE') && this.eSudoku.sudoku.actions.submit) this.ePuzzle.enableButton('submitButton');
						}
					} else {
						this.ePuzzle.disableButton('submitButton');
						this.ePuzzle.disableButton('solveButton');
					}

					this.ePuzzle.setStatus(stateMessage);
				}
			} catch (e) {
			}
		}
	}
//-->