Replaced all XHR in main.js with fetch/await
[citadel.git] / webcit-ng / static / js / main.js
index 0208866c41b071eb056a7a7b19c4caf496f96e6b..9fb998a3df9e50f4619466bd905492fac3c0ae97 100644 (file)
@@ -1,8 +1,10 @@
 //
-// Copyright (c) 2016-2017 by the citadel.org team
+// Copyright (c) 2016-2020 by the citadel.org team
 //
-// This program is open source software; you can redistribute it and/or modify
-// it under the terms of the GNU General Public License version 3.
+// This program is open source software.  It runs great on the
+// Linux operating system (and probably elsewhere).  You can use,
+// copy, and run it under the terms of the GNU General Public
+// License version 3.  Richard Stallman is an asshole communist.
 //
 // This program is distributed in the hope that it will be useful,
 // but WITHOUT ANY WARRANTY; without even the implied warranty of
@@ -20,6 +22,7 @@ var current_user = _("Not logged in.");
 var serv_info;
 var last_seen = 0;
 var messages_per_page = 20;
+var march_list = [] ;
 
 
 // Placeholder for when we add i18n later
@@ -33,12 +36,11 @@ function _(x) {
 //
 function randomString(length) {
        var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghiklmnopqrstuvwxyz'.split('');
+       var str = '';
 
-       if (! length) {
+       if (!length) {
                length = Math.floor(Math.random() * chars.length);
        }
-
-       var str = '';
        for (var i = 0; i < length; i++) {
                str += chars[Math.floor(Math.random() * chars.length)];
        }
@@ -49,84 +51,74 @@ function randomString(length) {
 // string escape for html display
 //
 function escapeHTML(text) {
-    'use strict';
-    return text.replace(/[\"&<>]/g, function (a) {
-        return {
-               '"': '&quot;',
-               '&': '&amp;',
-               '<': '&lt;',
-               '>': '&gt;'
-       }[a];
-    });
+       'use strict';
+       return text.replace(/[\"&<>]/g, function (a) {
+               return {
+                       '"': '&quot;',
+                       '&': '&amp;',
+                       '<': '&lt;',
+                       '>': '&gt;'
+               }[a];
+       });
 }
 
 
 // string escape for html display
 //
 function escapeHTMLURI(text) {
-    'use strict';
-    return text.replace(/./g, function (a) {
-        return '%' + a.charCodeAt(0).toString(16);
-    });
+       'use strict';
+       return text.replace(/./g, function (a) {
+               return '%' + a.charCodeAt(0).toString(16);
+       });
 }
 
 
 // string escape for JavaScript string
 //
 function escapeJS(text) {
-    'use strict';
-    return text.replace(/[\"\']/g, function (a) {
-        return '\\' + a ;
-    });
+       'use strict';
+       return text.replace(/[\"\']/g, function (a) {
+               return '\\' + a ;
+       });
 }
 
 
 // This is called at the very beginning of the main page load.
 //
-function ctdl_startup() {
-       var request = new XMLHttpRequest();
-       request.open("GET", "/ctdl/c/info", true);
-       request.onreadystatechange = function() {
-               if ((this.readyState === 4) && ((this.status / 100) == 2)) {
-                       ctdl_startup_2(JSON.parse(this.responseText));
+ctdl_startup = async() => {
+       response = await fetch("/ctdl/c/info");
+       serv_info = await(response.json());
+
+       if (response.ok) {
+               if (serv_info.serv_rev_level < 905) {
+                       alert("Citadel server is too old, some functions may not work");
                }
-       };
-       request.send();
-       request = null;
-}
 
-// Continuation of ctdl_startup() after serv_info is retrieved
-//
-function ctdl_startup_2(data) {
-       serv_info = data;
+               update_banner();
 
-       if (data.serv_rev_level < 905) {
-               alert("Citadel server is too old, some functions may not work");
+               // for now, show a room list in the main div
+               gotoroom("_BASEROOM_");
+               display_room_list();
        }
-
-       update_banner();
-
-       // for now, show a room list in the main div
-       gotoroom("_BASEROOM_");
-       display_room_list();
 }
 
+
 // Display a room list in the main div.
 //
 function display_room_list() {
-       document.getElementById("roomlist").innerHTML = "<img src=\"/ctdl/s/throbber.gif\" />" ;                // show throbber while loading
+       document.getElementById("roomlist").innerHTML = "<img src=\"/ctdl/s/throbber.gif\" />"; // show throbber while loading
 
-       var request = new XMLHttpRequest();
-       request.open("GET", "/ctdl/r/", true);
-       request.onreadystatechange = function() {
-               if ((this.readyState === 4) && ((this.status / 100) == 2)) {
-                       display_room_list_renderer(JSON.parse(this.responseText));
+       fetch_room_list = async() => {
+               response = await fetch("/ctdl/r/");
+               room_list = await(response.json());
+               if (response.ok) {
+                       display_room_list_renderer(room_list);
                }
-       };
-       request.send();
-       request = null;
+       }
+       fetch_room_list();
 }
 
+
 // Renderer for display_room_list()
 //
 function display_room_list_renderer(data) {
@@ -150,8 +142,10 @@ function display_room_list_renderer(data) {
                }
                new_roomlist_text = new_roomlist_text +
                        "<li>"
+                       + (data[i].hasnewmsgs ? "<b>" : "")
                        + "<a href=\"javascript:gotoroom('" + escapeJS(escapeHTML(data[i].name)) + "');\">"
                        + escapeHTML(data[i].name)
+                       + (data[i].hasnewmsgs ? "</b>" : "")
                        + "</a></li>"
                ;
        }
@@ -159,6 +153,7 @@ function display_room_list_renderer(data) {
        document.getElementById("roomlist").innerHTML = new_roomlist_text ;
 }
 
+
 // Update the "banner" div with all relevant info.
 //
 function update_banner() {
@@ -183,23 +178,64 @@ function update_banner() {
 // goto room
 //
 function gotoroom(roomname) {
-       var request = new XMLHttpRequest();
-       request.open("GET", "/ctdl/r/" + escapeHTMLURI(roomname) + "/", true);
-       request.onreadystatechange = function() {
-               if ((this.readyState === 4) && ((this.status / 100) == 2)) {
-                       gotoroom_2(JSON.parse(this.responseText));
+
+       fetch_room = async() => {
+               response = await fetch("/ctdl/r/" + escapeHTMLURI(roomname) + "/");
+               data = await(response.json());
+               if (response.ok) {
+                       current_room = data.name;
+                       new_messages = data.new_messages;
+                       total_messages = data.total_messages;
+                       current_view = data.current_view;
+                       default_view = data.default_view;
+                       last_seen = data.last_seen;
+                       update_banner();
+                       render_room_view(0, 9999999999);
                }
-       };
-       request.send();
-       request = null;
+       }
+       fetch_room();
+}
+
+
+// Goto next room with unread messages
+// which_oper is 0=ungoto, 1=skip, 2=goto
+//
+function gotonext(which_oper) {
+       if (which_oper != 2) return;            // FIXME implement the other two
+       if (march_list.length == 0) {
+               load_new_march_list();          // we will recurse back here
+       }
+       else {
+               next_room = march_list[0].name;
+               march_list.splice(0, 1);
+               console.log("going to " + next_room + " , " + march_list.length + " rooms remaining in march list");
+               gotoroom(next_room);
+       }
 }
-function gotoroom_2(data) {
-       current_room = data.name;
-       new_messages = data.new_messages;
-       total_messages = data.total_messages;
-       current_view = data.current_view;
-       default_view = data.default_view;
-       last_seen = data.last_seen;
-       update_banner();
-       render_room_view(0, Number.MAX_VALUE);
+
+
+// Called by gotonext() when the march list is empty.
+//
+function load_new_march_list() {
+       fetchm = async() => {
+               response = await fetch("/ctdl/r/");
+               march_list = await(response.json());
+               if (response.ok) {
+                       march_list = march_list.filter(function(room) {
+                               return room.hasnewmsgs;
+                       });
+                       march_list = march_list.sort(function(a,b) {
+                               if (a.floor != b.floor) {
+                                       return(a.floor - b.floor);
+                               }
+                               if (a.rorder != b.rorder) {
+                                       return(a.rorder - b.rorder);
+                               }
+                               return(a.name < b.name);
+                       });
+                       march_list.push({name:"_BASEROOM_",known:true,hasnewmsgs:true,floor:0});
+                       gotonext();
+               }
+       }
+       fetchm();
 }