113 lines
3.3 KiB
HTML
113 lines
3.3 KiB
HTML
<html>
|
|
<header>
|
|
<meta charset="UTF-8">
|
|
<script>
|
|
function who(form) {
|
|
var items = {}
|
|
for (var i=0; i<form.length; i++) {
|
|
if (form[i].name)
|
|
items[form[i].name] = form[i].value
|
|
}
|
|
var params = "?"
|
|
for(var k in items) {
|
|
params += k + "=" + items[k] + "&"
|
|
}
|
|
params = params.substr(0, params.length-1)
|
|
http("GET", "http://localhost:18114/who" + params, function(body, status) {
|
|
console.log(status, "body=",body)
|
|
}, null)
|
|
return false;
|
|
}
|
|
|
|
function http(method, remote, callback, body) {
|
|
var xmlhttp = new XMLHttpRequest();
|
|
xmlhttp.onreadystatechange = function() {
|
|
if (xmlhttp.readyState == XMLHttpRequest.DONE) {
|
|
console.log("KK", xmlhttp.readyState, xmlhttp.responseText, xmlhttp.status)
|
|
callback(xmlhttp.responseText, xmlhttp.status)
|
|
}
|
|
};
|
|
xmlhttp.open(method, remote, true);
|
|
if (typeof body == "undefined") {
|
|
body = null
|
|
}
|
|
xmlhttp.send(body);
|
|
}
|
|
function callback(responseBody, responseStatus) {
|
|
}
|
|
|
|
function draw(one) {
|
|
var id = one.id
|
|
var meta = one.meta
|
|
var know = one.know
|
|
var html = "<div>\n"
|
|
html += '<h2>' + id + '</h2>\n'
|
|
html += '<ul>\n'
|
|
for(var k in meta) {
|
|
html += '<li>'
|
|
html += k + ': '
|
|
var lines = meta[k].split("\n")
|
|
if (lines.length == 1) {
|
|
html += lines[0]
|
|
} else {
|
|
html += "<ul>"
|
|
lines.forEach(function(e) {
|
|
html += "<li>" + e + "</li>"
|
|
})
|
|
html += "</ul>"
|
|
}
|
|
html += '</li>\n'
|
|
}
|
|
html += '</ul>\n'
|
|
html += '<h3>Knows</h3>\n'
|
|
html += '<ul>\n'
|
|
for(var k of know) {
|
|
html += '<li>\n'
|
|
var action = '\'who([{name: "id", value: "' + k.id + '"}])\''
|
|
html += "<a href='#' onclick=" + action + ">"
|
|
html += k.id + ", <i>" + k.relation + " </i>"
|
|
html += "</a>"
|
|
html += '</li>\n'
|
|
}
|
|
html += '</ul>\n'
|
|
html += "</div>\n"
|
|
document.getElementById("display").innerHTML += html
|
|
}
|
|
|
|
function draw_clear() {
|
|
document.getElementById("display").innerHTML = ""
|
|
}
|
|
</script>
|
|
</header>
|
|
<body>
|
|
<h1>Goodbye World</h1>
|
|
<form onsubmit="who(this); return false;">
|
|
<input name="id" type="text"/>
|
|
<input type="submit"/>
|
|
</form>
|
|
<div id="display">
|
|
</div>
|
|
</body>
|
|
<footer>
|
|
<script>
|
|
draw({
|
|
id: "id",
|
|
meta: {
|
|
"20200710": "hello",
|
|
"20200711": "world\n!",
|
|
},
|
|
know: [
|
|
{
|
|
id: "id0",
|
|
relation: ":)",
|
|
},
|
|
{
|
|
id: "id1",
|
|
relation: ":(",
|
|
},
|
|
]
|
|
})
|
|
</script>
|
|
</footer>
|
|
</html>
|