ghost-in-the-machine/gitm.html at master · pconrad-fb/ghost-in-the-machine · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Ghost in the Machine</title>
<link rel="stylesheet" href="gitm.css">
</head>
<body>
<div id="entireChatThing" class="entireChatThing">
	<form id="chatForm">
	<!-- a div for the previous chat stuff -->
	<!-- use CSS to make her text blue and yours red? -->
	<!-- sometimes display a tiny GIF that looks like she's typing -->
	<!-- how do we make it asynchronous so that the player can say something while Abigail's thinking? -->
	<div id="chatWindow" class="chatWindow">
		<div id="chatHistory" class="chatHistory">
		</div>
		<br />
		<div><!-- Abby typing gif here, blank or animated of same size--></div>
	</div>
	<br />
	<!-- a text input for the player -->
	<input type="text" class="inputField"This id="inputText"></input>

	<!-- a submit button that grabs the contents of the text input and appends it to the div -->
	<!-- probably avoid actually submitting, just an onClick() to get the input -->

	<button id="submit" class="talkButton" name="Submit">Talk</button>
	</form>
</div>

<script type="text/javascript" src="gitm.json"></script>
<script type="text/javascript" src="gitm.js"></script>
<script type="text/javascript">

let form = document.getElementById("chatForm");
form.addEventListener('submit', processInput);
setup();
</script>
</body>
</html>