]>
Commit | Line | Data |
---|---|---|
827f21bb SW |
1 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" |
2 | "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> | |
3 | ||
4 | <html xmlns="http://www.w3.org/1999/xhtml"> | |
5 | <head> | |
6 | <title>Reliable Chat</title> | |
0248a518 | 7 | <style type="text/css"><!--/*--><![CDATA[/*><!--*/ |
70f46223 JH |
8 | html, body { |
9 | width: 99.9%; | |
10 | height: 100%; | |
11 | margin: 0; | |
12 | padding: 0; | |
13 | font-family: monospace; | |
14 | } | |
15 | #container { | |
16 | height: 100%; | |
17 | } | |
18 | #status { | |
19 | width: 100%; | |
20 | background-color: #eef; | |
21 | padding: 5px 5px 5px 0px; | |
22 | } | |
23 | #client { | |
24 | width: 98.5%; | |
25 | padding: 0px 0px 0px 5px; | |
26 | height: 50px; | |
27 | position: fixed; | |
28 | bottom: 0; | |
29 | } | |
30 | #input { | |
31 | width: 100%; | |
32 | } | |
0248a518 | 33 | #say { width: 100% } |
70f46223 JH |
34 | #history { |
35 | padding: 0px 5px 55px 5px; | |
36 | vertical-align: bottom | |
37 | } | |
0248a518 SW |
38 | img { width: 1px; height: 1px; } |
39 | iframe { display: none } | |
70f46223 | 40 | #status span { margin-right: 10px; } |
f09c4ede JH |
41 | #status span.sad { |
42 | background-color: #f00; | |
43 | color: #fff; | |
44 | border: 1px solid black; | |
45 | border-radius: 5px; | |
46 | padding-left: 5px; | |
47 | padding-right: 5px; | |
48 | } | |
49 | #status span.happy { | |
50 | background-color: #0f0; | |
51 | color: #000; | |
52 | border: 1px solid black; | |
53 | border-radius: 5px; | |
54 | padding-left: 5px; | |
55 | padding-right: 5px; | |
56 | } | |
0248a518 SW |
57 | /*]]>*/--></style> |
58 | <script type="text/javascript"><!--//--><![CDATA[//><!-- | |
59 | var servers = ['chkno.net', 'rc2.chkno.net', 'echto.net', 'the-wes.com', 'vibrantlogic.com']; | |
60 | ||
61 | var session = Math.random(); | |
62 | var seen = {}; | |
63 | ||
64 | function rcnick() { | |
65 | var nick = localStorage.getItem("nick"); | |
66 | if (nick) { | |
67 | return nick; | |
68 | } | |
69 | return 'anonymous'; | |
70 | } | |
71 | ||
72 | function rcsetnick(new_nick) { | |
73 | localStorage.setItem("nick", new_nick); | |
74 | } | |
75 | ||
76 | function rcserverbase(server) { | |
77 | // Add the default port if server doesn't contain a port number already | |
78 | if (server.indexOf(":") == -1) { | |
79 | return "http://" + server + ":21059"; | |
80 | } else { | |
81 | return "http://" + server; | |
82 | } | |
83 | } | |
84 | ||
85 | function rcchangeserverstatus(server, new_status) { | |
86 | var statusbar = document.getElementById("status"); | |
87 | var spans = statusbar.getElementsByTagName("span"); | |
88 | for (var i in spans) { | |
89 | if (spans[i].firstChild && 'data' in spans[i].firstChild && spans[i].firstChild.data == server) { | |
90 | spans[i].setAttribute("class", new_status); | |
91 | } | |
92 | } | |
93 | } | |
94 | ||
95 | function rcaddmessagetohistory(message) { | |
96 | var d = document.createElement("div"); | |
97 | d.appendChild(document.createTextNode(message)); | |
98 | var h = document.getElementById("history"); | |
99 | h.appendChild(d); | |
100 | window.scrollTo(0, document.body.scrollHeight); | |
101 | return d; | |
102 | } | |
103 | ||
104 | function make_seen_key(id, text) { | |
105 | return id.replace(/@/g, "@@") + "_@_" + text.replace(/@/g, "@@"); | |
106 | } | |
107 | ||
108 | function receiveMessage(server, time, id, text) { | |
109 | var seen_key = make_seen_key(id, text); | |
110 | if (!(seen_key in seen)) { | |
111 | seen[seen_key] = true; | |
112 | rcaddmessagetohistory(text); | |
113 | for (var i in servers) { | |
114 | rcchangeserverstatus(servers[i], "sad"); | |
115 | } | |
116 | } | |
117 | rcchangeserverstatus(server, "happy"); | |
118 | } | |
119 | ||
120 | function receiveMessageEvent(event) | |
121 | { | |
122 | for (var i in servers) { | |
123 | if (event.origin === rcserverbase(servers[i])) { | |
124 | messages = JSON.parse(event.data); | |
125 | for (var j in messages) { | |
126 | if ('Time' in messages[j] && | |
127 | 'ID' in messages[j] && | |
128 | 'Text' in messages[j]) { | |
129 | receiveMessage(servers[i], messages[j]['Time'], messages[j]['ID'], messages[j]['Text']); | |
130 | } | |
131 | } | |
132 | } | |
133 | } | |
134 | } | |
135 | ||
136 | function rcconnect() { | |
137 | window.addEventListener("message", receiveMessageEvent, false); | |
138 | for (var i in servers) { | |
139 | // Create a hidden iframe for same-origin workaround | |
140 | var iframe = document.createElement("iframe"); | |
141 | iframe.setAttribute("src", rcserverbase(servers[i]) + "/frame"); | |
142 | document.body.insertBefore(iframe, document.body.firstChild); | |
143 | // Status bar entry | |
144 | var status_indicator = document.createElement("span"); | |
145 | status_indicator.appendChild(document.createTextNode(servers[i])); | |
146 | status_indicator.setAttribute("class", "sad"); | |
147 | document.getElementById("status").appendChild(status_indicator); | |
148 | } | |
149 | if (rcnick() == 'anonymous') { | |
150 | rcaddmessagetohistory("-!- Set your nick with /nick"); | |
151 | } | |
152 | } | |
153 | ||
154 | function rcsend(d, message) { | |
155 | var id = new Date().getTime() + "-" + session + "-" + Math.random(); | |
156 | seen[make_seen_key(id, message)] = true; | |
157 | var path = "/speak" + | |
158 | "?id=" + encodeURIComponent(id) + | |
159 | "&text=" + encodeURIComponent(message); | |
160 | for (var i in servers) { | |
161 | var uri = rcserverbase(servers[i]) + path; | |
162 | var img = document.createElement("img"); | |
163 | img.setAttribute("src", uri); | |
164 | d.appendChild(img); | |
165 | } | |
166 | } | |
167 | ||
168 | function rckeydown(event) { | |
169 | if (event.keyCode == 13) { | |
170 | var input = document.input.say.value; | |
171 | document.input.say.value = ""; | |
172 | ||
173 | // Check nick change | |
174 | var message; | |
175 | var re = /^\/nick (.*)/; | |
176 | var match = re.exec(input); | |
177 | if (match) { | |
178 | message = "*** " + rcnick() + " is now known as " + match[1]; | |
179 | rcsetnick(match[1]); | |
180 | } else { | |
181 | message = "<" + rcnick() + "> " + input; | |
182 | } | |
183 | ||
d925d235 JH |
184 | // /me support |
185 | var message; | |
186 | var re = /^\/me (.*)/; | |
187 | var match = re.exec(input); | |
188 | var inputme = input.substring(4); | |
189 | if (match) { | |
190 | message = "* " + rcnick() + " " + inputme; | |
191 | } else { | |
192 | message = "<" + rcnick() + "> " + input; | |
193 | } | |
194 | ||
0248a518 SW |
195 | // Remind people to set their nick |
196 | if (rcnick() == 'anonymous') { | |
197 | rcaddmessagetohistory("-!- Set your nick with /nick"); | |
198 | } | |
199 | ||
200 | // Say the message | |
201 | var d = rcaddmessagetohistory(message); | |
202 | rcsend(d, message); | |
203 | } | |
204 | } | |
205 | //--><!]]></script> | |
206 | ||
827f21bb SW |
207 | </head> |
208 | ||
f0e385c7 | 209 | <body onload="rcconnect()"> |
70f46223 JH |
210 | <div id="container"> |
211 | <div id="history"></div> | |
212 | <div id="client"> | |
213 | <div id="input"> | |
214 | <form name="input" onsubmit="return false" autocomplete="off"> | |
215 | <input id="say" onkeydown="return rckeydown(event)" autocomplete="off" autofocus="autofocus"></input> | |
216 | </form></div> | |
217 | <div id="status"> </div> | |
218 | </div> | |
219 | </div> | |
827f21bb SW |
220 | </body> |
221 | </html> |