Display an alert if we cannot connect to Citadel Server, instead of leaving the user...
[citadel.git] / webcit-ng / static / js / main.js
1 //
2 // Copyright (c) 2016-2020 by the citadel.org team
3 //
4 // This program is open source software.  It runs great on the
5 // Linux operating system (and probably elsewhere).  You can use,
6 // copy, and run it under the terms of the GNU General Public
7 // License version 3.  Richard Stallman is an asshole communist.
8 //
9 // This program is distributed in the hope that it will be useful,
10 // but WITHOUT ANY WARRANTY; without even the implied warranty of
11 // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
12 // GNU General Public License for more details.
13
14
15 var current_room = "_BASEROOM_";
16 var new_messages = 0;
17 var total_messages = 0;
18 var default_view = 0;
19 var current_view = 0;
20 var logged_in = 0;
21 var current_user = _("Not logged in.");
22 var serv_info;
23 var last_seen = 0;
24 var messages_per_page = 20;
25 var march_list = [] ;
26
27
28 // Placeholder for when we add i18n later
29 function _(x) {
30         return x;
31 }
32
33
34 // Generate a random string of the specified length
35 // Useful for generating one-time-use div names
36 //
37 function randomString(length) {
38         var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghiklmnopqrstuvwxyz'.split('');
39         var str = '';
40
41         if (!length) {
42                 length = Math.floor(Math.random() * chars.length);
43         }
44         for (var i = 0; i < length; i++) {
45                 str += chars[Math.floor(Math.random() * chars.length)];
46         }
47         return str;
48 }
49
50
51 // string escape for html display
52 //
53 function escapeHTML(text) {
54         'use strict';
55         return text.replace(/[\"&<>]/g, function (a) {
56                 return {
57                         '"': '&quot;',
58                         '&': '&amp;',
59                         '<': '&lt;',
60                         '>': '&gt;'
61                 }[a];
62         });
63 }
64
65
66 // string escape for html display
67 //
68 function escapeHTMLURI(text) {
69         'use strict';
70         return text.replace(/./g, function (a) {
71                 return '%' + a.charCodeAt(0).toString(16);
72         });
73 }
74
75
76 // string escape for JavaScript string
77 //
78 function escapeJS(text) {
79         'use strict';
80         return text.replace(/[\"\']/g, function (a) {
81                 return '\\' + a ;
82         });
83 }
84
85
86 // This is called at the very beginning of the main page load.
87 //
88 ctdl_startup = async() => {
89         response = await fetch("/ctdl/c/info");
90
91         if (response.ok) {
92                 serv_info = await(response.json());
93                 if (serv_info.serv_rev_level < 905) {
94                         alert(_("Citadel server is too old, some functions may not work"));
95                 }
96
97                 update_banner();
98
99                 // for now, show a room list in the main div
100                 gotoroom("_BASEROOM_");
101                 display_room_list();
102         }
103         else {
104                 document.getElementById("ctdl-main").innerHTML =
105                         "<div class=\"w3-panel w3-red\"><p>"
106                         + _("This program was unable to connect or stay connected to the Citadel server.  Please report this problem to your system administrator.")
107                         + "</div>";
108         }
109 }
110
111
112 // Display a room list in the main div.
113 //
114 function display_room_list() {
115         document.getElementById("roomlist").innerHTML = "<img src=\"/ctdl/s/throbber.gif\" />"; // show throbber while loading
116
117         fetch_room_list = async() => {
118                 response = await fetch("/ctdl/r/");
119                 room_list = await(response.json());
120                 if (response.ok) {
121                         display_room_list_renderer(room_list);
122                 }
123         }
124         fetch_room_list();
125 }
126
127
128 // Renderer for display_room_list()
129 //
130 function display_room_list_renderer(data) {
131         data = data.sort(function(a,b) {
132                 if (a.floor != b.floor) {
133                         return(a.floor - b.floor);
134                 }
135                 if (a.rorder != b.rorder) {
136                         return(a.rorder - b.rorder);
137                 }
138                 return(a.name < b.name);
139         });
140
141         new_roomlist_text = "<ul>" ;
142
143         for (var i in data) {
144                 if (i > 0) {
145                         if (data[i].floor != data[i-1].floor) {
146                                 new_roomlist_text = new_roomlist_text + "<li class=\"divider\"></li>" ;
147                         }
148                 }
149                 new_roomlist_text = new_roomlist_text +
150                         "<li>"
151                         + (data[i].hasnewmsgs ? "<b>" : "")
152                         + "<a href=\"javascript:gotoroom('" + escapeJS(escapeHTML(data[i].name)) + "');\">"
153                         + escapeHTML(data[i].name)
154                         + (data[i].hasnewmsgs ? "</b>" : "")
155                         + "</a></li>"
156                 ;
157         }
158         new_roomlist_text = new_roomlist_text + "</ul>";
159         document.getElementById("roomlist").innerHTML = new_roomlist_text ;
160 }
161
162
163 // Update the "banner" div with all relevant info.
164 //
165 function update_banner() {
166         detect_logged_in();
167         if (current_room) {
168                 document.getElementById("ctdl_banner_title").innerHTML = current_room;
169                 document.title = current_room;
170         }
171         else {
172                 document.getElementById("ctdl_banner_title").innerHTML = serv_info.serv_humannode;
173         }
174         document.getElementById("current_user").innerHTML = current_user ;
175         if (logged_in) {
176                 document.getElementById("lilo").innerHTML = "<a href=\"/ctdl/a/logout\">" + _("Log off") + "</a>" ;
177         }
178         else {
179                 document.getElementById("lilo").innerHTML = "<a href=\"javascript:display_login_screen('')\">" + _("Log in") + "</a>" ;
180         }
181 }
182
183
184 // goto room
185 //
186 function gotoroom(roomname) {
187
188         fetch_room = async() => {
189                 response = await fetch("/ctdl/r/" + escapeHTMLURI(roomname) + "/");
190                 data = await(response.json());
191                 if (response.ok) {
192                         current_room = data.name;
193                         new_messages = data.new_messages;
194                         total_messages = data.total_messages;
195                         current_view = data.current_view;
196                         default_view = data.default_view;
197                         last_seen = data.last_seen;
198                         update_banner();
199                         render_room_view(0, 9999999999);
200                 }
201         }
202         fetch_room();
203 }
204
205
206 // Goto next room with unread messages
207 // which_oper is 0=ungoto, 1=skip, 2=goto
208 //
209 function gotonext(which_oper) {
210         if (which_oper != 2) return;            // FIXME implement the other two
211         if (march_list.length == 0) {
212                 load_new_march_list();          // we will recurse back here
213         }
214         else {
215                 next_room = march_list[0].name;
216                 march_list.splice(0, 1);
217                 console.log("going to " + next_room + " , " + march_list.length + " rooms remaining in march list");
218                 gotoroom(next_room);
219         }
220 }
221
222
223 // Called by gotonext() when the march list is empty.
224 //
225 function load_new_march_list() {
226         fetchm = async() => {
227                 response = await fetch("/ctdl/r/");
228                 march_list = await(response.json());
229                 if (response.ok) {
230                         march_list = march_list.filter(function(room) {
231                                 return room.hasnewmsgs;
232                         });
233                         march_list = march_list.sort(function(a,b) {
234                                 if (a.floor != b.floor) {
235                                         return(a.floor - b.floor);
236                                 }
237                                 if (a.rorder != b.rorder) {
238                                         return(a.rorder - b.rorder);
239                                 }
240                                 return(a.name < b.name);
241                         });
242                         march_list.push({name:"_BASEROOM_",known:true,hasnewmsgs:true,floor:0});
243                         gotonext();
244                 }
245         }
246         fetchm();
247 }