$maxRefinement = 3;

$txts = new Array();
$txts[ 'vraagwoord' ] = 'Kies hier een ‘vraagwoord’ uit dat past bij de vraag die je wilt stellen. Doe alsof je de vraag stelt aan iemand die het antwoord zeker weet. Als je wilt vragen naar een recept voor risotto, kies je ‘hoe’ (voor zoiets als ‘Hoe maak ik risotto?’). ‘Waar’ (voor ‘Waar vind ik een recept voor risotto?’) is niet zo geschikt: je wilt het recept vinden, niet de plek waar het recept is opgeslagen.';
$txts[ 'vraagonderwerp' ] = 'Vul hier je belangrijkste ‘vraagonderwerp’ in. Als je een dierentuin zoekt waar je gorilla’s kunt zien, is dat ‘dierentuin’.  Bij de eigenschappen kun je dan later aan geven dat het een dierentuin moet zijn waar ook gorilla’s te zien zijn. Hier ‘gorilla’s’ invullen leidt af van waar het eigenlijk om gaat: een bezoekje aan een dierentuin.';
$txts[ 'vraageigenschap' ] = 'Geef hier meer informatie over het vraagonderwerp: een ‘eigenschap’ ervan. Als dat ‘risotto’ was, dan kun je hier ‘recept’ invullen, en als het ‘dierentuin’ was, kun je hier ‘gorilla’s’ invullen (of ‘met gorilla’s’, maar je zult merken dat woorden als ‘met’ vaak beter weg gelaten kunnen worden).';
$txts[ 'vraagverfijning' ] = 'info tekst voor vraagverfijning.';
$txts[ 'vraagverfijningwoord' ] = 'Hier kun je vraagonderwerp en eigenschap ‘verfijnen’ of ‘uitbreiden’. Van ‘dierentuin’ maak je bijvoorbeeld ‘dierentuin OF dierenpark OF safaripark’, en van ‘rijst’ maakt je ‘rijst EN Italiaans’. En van ‘auto’ maak je ‘auto EN Honda’ (alléén auto’s van dat merk, en géén motorfietsen van dat merk).';
$txts[ 'vraagverfijningmax' ] = 'Je kunt maximaal ' + $maxRefinement + ' verfijningen of uitbreidingen aangeven.';

function updateQueryString()
{
	$rrs = $$( '#tableSearch tr.refine' );
	$query = '';
	$query += $( 'vraagwoord' ).value.trim().length ? $( 'vraagwoord' ).value.trim() + ' ' : '';
	$query += $( 'vraagonderwerp' ).value.trim().length ? $( 'vraagonderwerp' ).value.trim() + ' ' : '';
	$query += $( 'vraageigenschap' ).value.trim().length ? $( 'vraageigenschap' ).value.trim() + ' ' : '';
	for( $a = 0; $a < $rrs.length; $a++ )
	{
		$idPart = 'vraagverfijning' + $a;
		$operand = $( $idPart ).value.trim().length ? $( $idPart ).value.trim() : '';
		$operand += $operand.toLowerCase() == 'or' ? ' ' : '';
		$query += $operand.trim().length && $( $idPart + 'woord' ).value.trim().length ? $operand + $( $idPart + 'woord' ).value.trim() + ' ' : '';
	}
	$( 'vraag' ).value = $query;
}

function submitSearchForm()
{
	$q = encodeURIComponent( $( 'vraag' ).value );
	$windowResults = window.open( 'http://www.google.nl/search?hl=nl&q=' + $q,'searchResults' );
	$windowResults.focus();
}

function addRefinement()
{
	$ts = document.getElementById( 'tableSearch' );
	$rrs = $$( '#tableSearch tr.refine' );
	$rbr = document.getElementById( 'refineButtonRow' );
	$ts.rowCount = $rrs.length;
	if( $ts.rowCount < $maxRefinement )
	{
		$rrNew = document.createElement( 'tr' );
		$rrNew.className = 'refine';
		$tdTemplate = document.createElement( 'td' );
		$td1 = $rrNew.appendChild( $tdTemplate.cloneNode( true ) );
		$td2 = $rrNew.appendChild( $tdTemplate.cloneNode( true ) );
		$td2.innerHTML = '<label for="vraagverfijning' + $ts.rowCount + '" class="green-light">verfijnen of uitbreiden</label>';
		$td3 = $rrNew.appendChild( $tdTemplate.cloneNode( true ) );
		$td3.setAttribute( 'align', 'right' );
		$td3.innerHTML = '' +
		'		<select id="vraagverfijning' + $ts.rowCount + '" name="vraagverfijning' + $ts.rowCount + '" class="refinement" onchange="updateQueryString();" onfocus="showInfoBox( this.nextSibling.nextSibling, \'vraagverfijningwoord\', \'green-light\' );" onblur="hideInfoBox();">' +
		'			<option value="OR">OR</option>' +
		'			<option value="+">+</option>' +
		'			<option value="-">-</option>' +
		'		</select>' +
		'		<input type="text" id="vraagverfijning' + $ts.rowCount + 'woord" name="vraagverfijning' + $ts.rowCount + 'woord" class="refinement" onkeyup="updateQueryString();" onfocus="showInfoBox( this, \'vraagverfijningwoord\', \'green-light\' );" onblur="hideInfoBox();">';
		$td4 = $rrNew.appendChild( $tdTemplate.cloneNode( true ) );
		$rbr.parentNode.insertBefore( $rrNew, $rbr );
	}
	else
	{
		showInfoBox( 'vraagverfijningextra', 'vraagverfijningmax', 'green-light' );
		
	}
}

function showInfoBox( $obj, $type, $class )
{
	$class = $class != undefined ? $class : '';
	$infoBoxMarginLeft = 10;
	$obj = $( $obj );
	$coords = $obj.getCoordinates();
	$infoBox = $( 'infoBox' );
	$infoBox.className = $class;
	$infoBoxTable = $$( '#infoBox table' )[ 0 ];
	$infoBoxTable.style.height = $class == 'green-dark' ? '126px' : '117px';
	$infoBoxTableCell = $$( '#infoBox table tr td' )[ 0 ];
	$infoBoxTableCell.innerHTML = $txts[ $type ];
	$infoBox.style.left = ( $coords.right + $infoBoxMarginLeft ) + 'px';
	$infoBox.style.top = parseInt( $coords.top + ( $coords.height / 2 ) ) + 'px';
	$infoBox.style.display = 'block';
}

function hideInfoBox()
{
	$infoBox = $( 'infoBox' );
	$infoBox.style.display = 'none';
}