git.scottworley.com Git - reliable-chat/blob - webclient/rc.html

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