5 files changed, 116 insertions(+), 1 deletions(-)

A static/chat.js
M static/def.css
M static/fn.js
M static/index.html
M static/light-list.js

@@ 0,0 1,82 @@
+function html_message(msg)
+{
+    var d = new Date(msg["tim"]);
+    var ih = "";
+    ih += "<br />";
+    ih += "<small>" + d.toLocaleTimeString() + "</small>";
+    ih += " <em>" + msg["usr"] + "</em>:";
+    ih += " " + msg["msg"];
+    return ih;
+}
+function add_msg(t)
+{
+    var msg = JSON.parse(t);
+    up("chat_messages", html_message(msg), true);
+    var messages = document.getElementById("chat_messages");
+    messages.scrollTop = messages.scrollHeight;
+}
+function html_chat()
+{
+    var ih = "";
+    ih += "<h2>" + L("chat") + "</h2>";
+    ih += "<div id='chat_nav'>";
+    ih += "</div>";
+    ih += "<div id='chat_messages'></div>";
+    ih += "<input id='chat_msg' type='text' onkeypress='send_msg(event)' />";
+    return ih;
+}
+function update_chat_nav(li)
+{
+    var nl = {};
+    nl["all"] = 0;
+    for (var k in li) {
+        nl[li[k]["aid"] + ": " + li[k]["tags"]] = li[k]["aid"];
+    }
+    var nav_links = {
+        "&lt;- list": "javascript:go_to(\"list\")",
+    };
+    if (!api.token()) nav_links["authenticate"] = "javascript:api.auth()";
+    var ih = "";
+    ih += html_menu(nav_links);
+    ih += "chat within area ";
+    ih += html_option_list(nl, "chat_within", null);
+    up("chat_nav", ih);
+}
+function show_chat(aid=false)
+{
+    up("damn_main", html_chat());
+    api.get_areas(update_chat_nav),
+    add_hist("chat", link_to("chat", aid));
+    chat_size();
+    if (aid) {
+        document.getElementById("chat_within").value = aid;
+    }
+}
+function chat_size()
+{
+    try {
+        var f = document.getElementById("footer");
+        f.style.position = "absolute";
+        f.style.bottom = "0px";
+        var m = document.getElementById("chat_msg");
+        m.style.position = "absolute";
+        m.style.bottom = (f.offsetHeight + 5) + "px";
+        var s = document.getElementById("chat_messages");
+        s.style.height = Math.abs(s.offsetTop - m.offsetTop) + "px";
+    } catch(e) {}
+}
+function send_msg(e)
+{
+    if (e.keyCode == 13) {
+        const msg = document.getElementById("chat_msg");
+        var user = api.user()["display_name"];
+        var token = api.token();
+        const t = msg.value;
+        ws.send(JSON.stringify({
+            "usr": user,
+            "msg": t,
+            "jwt": token,
+        }));
+        msg.value = "";
+    }
+}

@@ 210,3 210,11 @@ div#square_menu {
         width: 50%;
     }
 }
+#chat_messages {
+    overflow: auto;
+    min-height: 8em;
+    width: 100%;
+}
+#chat_msg {
+    width: 100%;
+}

@@ 90,6 90,8 @@ function click_to(where="list", aid=false, of=false)
 }
 function go_to(where="list", aid=false, of=false)
 {
+    document.getElementById("footer").style.position = "";
+    document.getElementById("footer").style.bottom = "";
     up("damn_info", "");
     document.removeEventListener("contextmenu", prevent_def);
     switch (where) {


@@ 124,12 126,16 @@ function go_to(where="list", aid=false, of=false)
         else
             api.get_area(show_light_stats, aid, note);
         break;
+    case "chat":
+        ws = new WebSocket("wss://chat.damn-project.org");
+        show_chat(aid);
+        break;
     }
 }
 // create links
 function link_to(where="list", aid=false, of=false)
 {
-    var to = ["area", "panel", "mappy", "stats"];
+    var to = ["area", "panel", "mappy", "stats", "chat"];
     var link = window.location.protocol;
     link += "//";
     link += window.location.hostname;


@@ 138,6 144,8 @@ function link_to(where="list", aid=false, of=false)
         return link + "?" + where + "=" + aid + "&of=" + of;
     else if (aid && to.includes(where))
         return link + "?" + where + "=" + aid;
+    else if (to.includes(where))
+        return link + "?" + where;
     return link;
 }
 function link_to_edit(edit="id", aid=false, sid=false, msg="", mm=false)

@@ 35,8 35,22 @@ SOFTWARE.
 <script src="panel-area.js"></script>
 <script src="mappy-area.js"></script>
 <script src="light-stats.js"></script>
+<script src="chat.js"></script>
 <script>
+    window.addEventListener("resize", chat_size);
+    var ws = new WebSocket("wss://chat.damn-project.org");
+    ws.onopen = function() {
+        try { document.getElementById("messages").innerHTML = "Connected."; }
+        catch {}
+    };
+    ws.onmessage = function(m) {
+        try { add_msg(m.data); } catch(e) {}
+    };
+    ws.onclose = function() {
+        try { add_msg("Disconnected."); } catch(e) {}
+    };
     var api = new DamnAPI("https://server.damn-project.org");
+    //var api = new DamnAPI("http://localhost:8000");
     var panel_e = false;
     var mappy_i = {
         "ed": false,


@@ 74,6 88,8 @@ SOFTWARE.
                 return go_to("stats", sp.get("stats"), sp.get("of"));
             else
                 return go_to("stats", sp.get("stats"));
+        } else if (sp.has("chat")) {
+            return go_to("chat", (sp.get("chat")==="") ? false : sp.get("chat"));
         }
         return go_to("list");
     }

@@ 23,6 23,7 @@ function html_options_card()
     };
     var authed_links = {
         "reload list": "javascript:api.get_areas(show_list_of_areas)",
+        "chat": "javascript:show_chat()",
         "re-authenticate": "javascript:api.auth()",
         "log out": "javascript:api.del_token()",
     };