89 lines
		
	
	
		
			2.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			89 lines
		
	
	
		
			2.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <html>
 | |
| 	<head>
 | |
| 		<title>Tidx Test</title>
 | |
| 		<style type="text/css">
 | |
| 			td { vertical-align: top; }
 | |
| 			th { text-align: left; }
 | |
| 		</style>
 | |
| 	</head>
 | |
| 	<body>
 | |
| 		<input type="text" id="search" name="search" size="50" />
 | |
| 		<input type="button" id="btn_search" value="Search" />
 | |
| 		<br/><br/>
 | |
| 		<textarea name="output" id="output" rows="10" cols="40"></textarea>
 | |
| 		<table>
 | |
| 			<thead>
 | |
| 				<tr>
 | |
| 					<th>ID</th>
 | |
| 					<th>Name</th>
 | |
| 					<th>Email</th>
 | |
| 					<th>City</th>
 | |
| 					<th>State</th>
 | |
| 					<th>Country</th>
 | |
| 					<th>Rank</th>
 | |
| 					<th>Description</th>
 | |
| 				</tr>
 | |
| 			</thead>
 | |
| 			<tbody id="result_table"></tbody>
 | |
| 		</table>
 | |
| 		<script type="text/javascript" src="tidx.js"></script>
 | |
| 		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
 | |
| 		<script type="text/javascript">
 | |
| 			var t = new Tidx();
 | |
| 			var json = null;
 | |
| 
 | |
| 			$(function(){
 | |
| 				var output = $('#output');
 | |
| 
 | |
| 				// Load test JSON
 | |
| 				output.val('Loading test.json .. ');
 | |
| 				$.getJSON('test.json', function(data){
 | |
| 					json = data;
 | |
| 					output.val(output.val() + "loaded\nIndexing test.json .. ");
 | |
| 
 | |
| 					var s = new Date().getTime();
 | |
| 					for(var i = 0; i < json.length; i++){
 | |
| 						for(var f in json[i]){
 | |
| 							if(f != 'id'){ t.index(i, f, json[i][f]); }
 | |
| 						}
 | |
| 					}
 | |
| 
 | |
| 					output.val(output.val() + 'indexed in ' + (new Date().getTime() - s) + "ms\n");
 | |
| 				});
 | |
| 
 | |
| 				// Setup the search button
 | |
| 				$('#btn_search').click(function(){
 | |
| 					output.val(output.val() + 'Searching .. ');
 | |
| 
 | |
| 					var s = new Date().getTime();
 | |
| 					var results = t.search($('#search').val());
 | |
| 					output.val(output.val() + 'completed in ' + (new Date().getTime() - s) + "ms\n");
 | |
| 
 | |
| 					var rtbl = $('#result_table').empty();
 | |
| 					for(var idx in results){
 | |
| 						var i = results[idx];
 | |
| 						
 | |
| 						rtbl.append(
 | |
| 							'<tr>' + 
 | |
| 								'<td>' + json[i]['id'] + '</td>' +
 | |
| 								'<td>' + json[i]['name'] + '</td>' +
 | |
| 								'<td>' + json[i]['email'] + '</td>' +
 | |
| 								'<td>' + json[i]['city'] + '</td>' +
 | |
| 								'<td>' + json[i]['state'] + '</td>' +
 | |
| 								'<td>' + json[i]['country'] + '</td>' +
 | |
| 								'<td>' + json[i]['rank'] + '</td>' +
 | |
| 								'<td>' + json[i]['desc'] + '</td>' +
 | |
| 							'</tr>'
 | |
| 						);
 | |
| 					}
 | |
| 				});
 | |
| 
 | |
| 				// Enter should work to search, too
 | |
| 				$('#search').keydown(function(e){
 | |
| 					if(e.which == 13){ $('#btn_search').click(); }
 | |
| 				}).focus();
 | |
| 			});
 | |
| 		</script>
 | |
| 	</body>
 | |
| </html>
 |