1 files changed, 63 insertions, 0 deletions
diff --git a/html/index.html b/html/index.html
new file mode 100644
index 0000000..a27b654
--- /dev/null
+++ b/html/index.html
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>MIDIPLAY</title>
+
+<style>
+.button{
+	width: 200px;
+	height: 150px;
+	font-size: 20px;
+}
+</style>
+<script type="text/javascript">
+	function playbutton_clicked()
+	{
+		var element = document.getElementById("playbutton");
+		if (element.innerHTML == "Play") {
+			element.innerHTML = "Stop";
+		} else {
+			element.innerHTML = "Play";
+		}
+
+          var xhr = new XMLHttpRequest();
+
+          xhr.onreadystatechange = function() {
+                        if (this.readyState != 4) {
+                                return;
+                        }
+                        if (this.status != 200) {
+                                document.getElementById("status").innerHTML = "HTTP error";
+                        } else {
+                          var xml = xhr.responseXML;
+                          var value = xml.getElementsByTagName("value1")[0].childNodes[0].nodeValue;
+                          document.getElementById("songlist").innerHTML = value;
+                        }
+          }
+
+          xhr.open("POST", "midiplay.fcgi" + "?command=list", true);
+          xhr.setRequestHeader("Content-type", "text/xml");
+          xhr.send("<data><value1>3</value1></data>");
+	}
+
+	function startup() {
+		document.getElementById("playbutton").onclick = playbutton_clicked;
+
+		document.getElementById("songlist").innerHTML = "01 Locked Out Of Heaven";
+	}
+
+</script>
+	</head>
+	<body onload="startup();">
+MIDIPLAY
+
+<br/>
+<br/>
+<div id="songlist">
+</div>
+<br/>
+<br/>
+<button id="playbutton" class="button">Play</button>
+
+	</body>
+</html>