gdey/index.html

## index.html
<!doctype html>
<!---
   This is a simple html/js page for interacting with an instance of webdis (https://github.com/nicolasff/webdis)
-->
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
		<meta name="viewport" content="width=device-width, initial-scale=1" />

		<title>Web Dis-UI</title>

		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
		<!-- Optional theme -->
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

		<script>
			function presentOutput(header, json){
				var pretty = JSON.stringify(json,undefined, 4);
                                var html = '<div class="panel-heading">'+header+
                                           '</div><div class="panel-body"><pre>'+
                                           pretty+'</pre></div></div>';
				var code = document.createElement("div");
                                code.className = 'panel panel-default';
				code.innerHTML = html;


				var console = document.getElementById('console')
				var fchild = console.firstChild;
				console.insertBefore(code,fchild);

			}
			function prettyPrint() {
				var obj = JSON.parse(document.getElementById('value').value)
				presentOutput(obj);
				return true;
			}

			function getValue(){
				var address = document.getElementById('address').value
				var key = document.getElementById('key').value
				if( key == "" ){
					key = document.getElementById('key').placeholder
				}
				var xhttp = new XMLHttpRequest();
				xhttp.onreadystatechange = function() {
					if (this.readyState == 4 && this.status == 200) {
						var obj = JSON.parse(this.responseText)
						if( obj["GET"] === null ){
							document.getElementById("value").value = ""
						} else {
							document.getElementById("value").value = obj["GET"]
						}
						presentOutput('<b>Get</b> '+key,obj);
					}
				};
				xhttp.open("GET", "http://"+address+"/GET/"+key, true);
				xhttp.send();
				return true;
			}
			function setValue(getAsWell){
                                var gaw = !!getAsWell;
				var address = document.getElementById('address').value
				var key = document.getElementById('key').value
				if( key == "" ){
					key = document.getElementById('key').placeholder
				}
				var xhttp = new XMLHttpRequest();
				xhttp.onreadystatechange = function(){
					if (this.readyState == 4 && this.status == 200) {
						var obj = JSON.parse(this.responseText)
						presentOutput('<b>Set</b> '+key,obj);
						if( gaw ){
                                                     getValue();
                                                }
					}
				};
				xhttp.open("PUT","http://"+address+"/SET/"+key,true);
				xhttp.send(document.getElementById('value').value);
			}
		</script>
	</head>
	<body>
		<div class="container">
		<div class="row">
		<div class="col-md-8">
			<p>
			<div class="input-group">
				<span  class="input-group-addon" id="address-header">Address</span>
				<input class="form-control" type="url" value="127.0.0.1:7379" id="address" aria-describedby="address-header"></input>
			</div>
			<br />
			</p>
		</div>
		</div> <!-- row -->
		<div class="row"></div>
		<div class="col-md-4">
			<div class="input-group" id="get_bar">
                                <span class="input-group-addon" id="key-header">Key</span>
				<input class="form-control" type="Text"  placeholder="world" id="key" name="key" onchange="getValue()"></input>
			</div>
			<div class="form-group" id="set_bar">
				<label>Value</label>
				<textarea class="form-control" placeholder="value to set" name="value" id="value" rows="9"></textarea>
				<p class="text-right">
				<br/>
				<button class="btn-sm" onclick="setValue(true)">set</button>
				</p>

			</div>
		</div> <!-- col -->
		<div class="col-md-8">
                        <div class="panel panel-default">
			<div class="panel-heading"><h5>Console</h5></div>
			<div class="panel-body" id="console"></div>
			</div>
		</div> <!-- col -->
		</div> <!-- row -->
		</div> <!-- container -->
		<!-- End of document Javascript -->
		<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
		<!-- Latest compiled and minified JavaScript -->
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
		<script>getValue();</script>
	</body>

</html>
	<!doctype html>
	<!---
	This is a simple html/js page for interacting with an instance of webdis (https://github.com/nicolasff/webdis)
	-->
	<html lang="en">
	<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
	<meta name="viewport" content="width=device-width, initial-scale=1" />

	<title>Web Dis-UI</title>

	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
	<!-- Optional theme -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

	<script>
	function presentOutput(header, json){
	var pretty = JSON.stringify(json,undefined, 4);
	var html = '<div class="panel-heading">'+header+
	'</div><div class="panel-body"><pre>'+
	pretty+'</pre></div></div>';
	var code = document.createElement("div");
	code.className = 'panel panel-default';
	code.innerHTML = html;



	var console = document.getElementById('console')
	var fchild = console.firstChild;
	console.insertBefore(code,fchild);

	}
	function prettyPrint() {
	var obj = JSON.parse(document.getElementById('value').value)
	presentOutput(obj);
	return true;
	}

	function getValue(){
	var address = document.getElementById('address').value
	var key = document.getElementById('key').value
	if( key == "" ){
	key = document.getElementById('key').placeholder
	}
	var xhttp = new XMLHttpRequest();
	xhttp.onreadystatechange = function() {
	if (this.readyState == 4 && this.status == 200) {
	var obj = JSON.parse(this.responseText)
	if( obj["GET"] === null ){
	document.getElementById("value").value = ""
	} else {
	document.getElementById("value").value = obj["GET"]
	}
	presentOutput('<b>Get</b> '+key,obj);
	}
	};
	xhttp.open("GET", "http://"+address+"/GET/"+key, true);
	xhttp.send();
	return true;
	}
	function setValue(getAsWell){
	var gaw = !!getAsWell;
	var address = document.getElementById('address').value
	var key = document.getElementById('key').value
	if( key == "" ){
	key = document.getElementById('key').placeholder
	}
	var xhttp = new XMLHttpRequest();
	xhttp.onreadystatechange = function(){
	if (this.readyState == 4 && this.status == 200) {
	var obj = JSON.parse(this.responseText)
	presentOutput('<b>Set</b> '+key,obj);
	if( gaw ){
	getValue();
	}
	}
	};
	xhttp.open("PUT","http://"+address+"/SET/"+key,true);
	xhttp.send(document.getElementById('value').value);
	}
	</script>
	</head>
	<body>
	<div class="container">
	<div class="row">
	<div class="col-md-8">
	<p>
	<div class="input-group">
	<span class="input-group-addon" id="address-header">Address</span>
	<input class="form-control" type="url" value="127.0.0.1:7379" id="address" aria-describedby="address-header"></input>
	</div>
	<br />
	</p>
	</div>
	</div> <!-- row -->
	<div class="row"></div>
	<div class="col-md-4">
	<div class="input-group" id="get_bar">
	<span class="input-group-addon" id="key-header">Key</span>
	<input class="form-control" type="Text" placeholder="world" id="key" name="key" onchange="getValue()"></input>
	</div>
	<div class="form-group" id="set_bar">
	<label>Value</label>
	<textarea class="form-control" placeholder="value to set" name="value" id="value" rows="9"></textarea>
	<p class="text-right">
	<br/>
	<button class="btn-sm" onclick="setValue(true)">set</button>
	</p>

	</div>
	</div> <!-- col -->
	<div class="col-md-8">
	<div class="panel panel-default">
	<div class="panel-heading"><h5>Console</h5></div>
	<div class="panel-body" id="console"></div>
	</div>
	</div> <!-- col -->
	</div> <!-- row -->
	</div> <!-- container -->
	<!-- End of document Javascript -->
	<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	<!-- Latest compiled and minified JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
	<script>getValue();</script>
	</body>

	</html>