<!DOCTYPE HTML>
<html>
	<head>
		<?php
			$wallcon = true;
		?>
		<script src="../js/libs/jquery.js"></script>
		<script src="../js/utils.js?v=<?php if ($wallcon) echo PHP_INT_MAX; else echo filemtime("js/utils.js"); ?>"></script>
		<script src="../js/storage.js?v=<?php if ($wallcon) echo PHP_INT_MAX; else echo filemtime("js/storage.js"); ?>"></script>
		<script>
			controllerlist = [];
			manufacturerlist = [];
			str = '';
			$(document).ready(function(){
				server({
					opts: {command: 'read_allcontrollers'},
						callback: function(data){
							controllerlist = json_decode(data);
							for (var i=0; i<controllerlist.length; i++){
								if (!arrayContains(manufacturerlist, controllerlist[i].manufacturer))
									manufacturerlist.push(controllerlist[i].manufacturer);
							}
							str = '';
							for (var i=0; i<manufacturerlist.length; i++){
								str += '<option value="'+manufacturerlist[i]+'">'+manufacturerlist[i]+'</option>';
							}
							$('#controllermanufacturers').html(str);
							str = '';
							for (var i=0; i<controllerlist.length; i++){
								if (controllerlist[i].manufacturer == manufacturerlist[0])
									str += '<option value="'+controllerlist[i].file+'">'+controllerlist[i].make+'</option>';
							}
							$('#controllers').html(str);
							$('#controllercode').load('../'+$('#controllers').val());
							
							$('#controllers').change(function(){
								$('#controllercode').load('../'+$('#controllers').val());
							});
							$('#controllermanufacturers').change(function(){
								str = '';
								for (var i=0; i<controllerlist.length; i++){
									if (controllerlist[i].manufacturer == $('#controllermanufacturers').val())
										str += '<option value="'+controllerlist[i].file+'">'+controllerlist[i].make+'</option>';
								}
								$('#controllers').html(str);
								$('#controllercode').load('../'+$('#controllers').val());
							});
						}
				}, '../server.php');
			});
		</script>
	</head>
	<body>
		<select id="controllermanufacturers"></select>
		<select id="controllers"></select>
		<div id="controllercontainer" style="width: 90%; height: 85%; border: 1px solid black;
			position: absolute; right: 5%; top: 10%; overflow-y: auto; background: #eeeeee;"><pre id="controllercode"></pre></div>
	</body>
</html>