Move http functions to new javascript file http.js.

frontends/etiquette_flask/static/js/api.js

@@ -6,15 +6,19 @@ api.admin = {};
 api.admin.reload_config =
 function reload_config(callback)
 {
-    const url = "/admin/reload_config";
+    return http.post({
-    return common.post(url, null, callback);
+        url: "/admin/reload_config",
+        callback: callback,
+    });
 }
 
 api.admin.uncache =
 function uncache(callback)
 {
-    const url = "/admin/uncache";
+    return http.post({
-    return common.post(url, null, callback);
+        url: "/admin/uncache",
+        callback: callback,
+    });
 }
 
 /**************************************************************************************************/
@@ -34,96 +38,119 @@ function _add_remove_photos(album_id, photo_ids, add_or_remove, callback)
     if (Array.isArray(photo_ids))
         { photo_ids = photo_ids.join(","); }
 
-    const data = {"photo_id": photo_ids};
+    return http.post({
-    return common.post(url, data, callback);
+        url: url,
+        data: {"photo_id": photo_ids},
+        callback: callback
+    });
 }
 
 api.albums.add_child =
 function add_child(album_id, child_id, callback)
 {
-    const url = `/album/${album_id}/add_child`;
+    return http.post({
-    const data = {"child_id": child_id};
+        url: `/album/${album_id}/add_child`,
-    return common.post(url, data, callback);
+        data: {"child_id": child_id},
+        callback: callback,
+    });
 }
 
 api.albums.add_photos =
 function add_photos(album_id, photo_ids, callback)
 {
-    api.albums._add_remove_photos(album_id, photo_ids, "add", callback);
+    return api.albums._add_remove_photos(album_id, photo_ids, "add", callback);
 }
 
 api.albums.create =
 function create(title, parent_id, callback)
 {
-    const url = "/albums/create_album";
+    return http.post({
-    const data = {"title": title, "parent_id": parent_id};
+        url: "/albums/create_album",
-    return common.post(url, data, callback);
+        data: {"title": title, "parent_id": parent_id},
+        callback: callback,
+    });
 }
 
 api.albums.delete =
 function _delete(album_id, callback)
 {
-    const url = `/album/${album_id}/delete`;
+    return http.post({
-    return common.post(url, null, callback);
+        url: `/album/${album_id}/delete`,
+        callback: callback,
+    });
 }
 
 api.albums.get_all_albums =
 function get_all_albums(callback)
 {
-    const url = "/all_albums.json";
+    return http.get({
-    return common.get(url, callback);
+        url: "/all_albums.json",
+        callback: callback,
+    });
 }
 
 api.albums.edit =
 function edit(album_id, title, description, callback)
 {
-    const url = `/album/${album_id}/edit`;
+    return http.post({
-    const data = {"title": title, "description": description};
+        url: `/album/${album_id}/edit`,
-    return common.post(url, data, callback);
+        data: {"title": title, "description": description},
+        callback: callback,
+    });
 }
 
 api.albums.refresh_directories =
 function refresh_directories(album_id, callback)
 {
-    const url = `/album/${album_id}/refresh_directories`;
+    return http.post({
-    return common.post(url, null, callback);
+        url: `/album/${album_id}/refresh_directories`,
+        callback: callback,
+    });
 }
 
 api.albums.remove_child =
 function remove_child(album_id, child_id, callback)
 {
-    const url = `/album/${album_id}/remove_child`;
+    return http.post({
-    const data = {"child_id": child_id};
+        url: `/album/${album_id}/remove_child`,
-    return common.post(url, data, callback);
+        data: {"child_id": child_id},
+        callback: callback,
+    });
 }
 
 api.albums.remove_photos =
 function remove_photos(album_id, photo_ids, callback)
 {
-    api.albums._add_remove_photos(album_id, photo_ids, "remove", callback);
+    return api.albums._add_remove_photos(album_id, photo_ids, "remove", callback);
 }
 
 api.albums.remove_thumbnail_photo =
 function remove_thumbnail_photo(album_id, callback)
 {
-    const url = `/album/${album_id}/remove_thumbnail_photo`;
+    return http.post({
-    const data = {};
+        url: `/album/${album_id}/remove_thumbnail_photo`,
-    return common.post(url, data, callback);
+        data: {},
+        callback: callback,
+    });
 }
 
 api.albums.set_thumbnail_photo =
 function set_thumbnail_photo(album_id, photo_id, callback)
 {
-    const url = `/album/${album_id}/set_thumbnail_photo`;
+    return http.post({
-    const data = {"photo_id": photo_id};
+        url: `/album/${album_id}/set_thumbnail_photo`,
-    return common.post(url, data, callback);
+        data: {"photo_id": photo_id},
+        callback: callback,
+    });
 }
 
 api.albums.show_in_folder =
 function show_in_folder(album_id, callback)
 {
-    const url = `/album/${album_id}/show_in_folder`;
+    return http.post({
-    return common.post(url, null, callback);
+        url: `/album/${album_id}/show_in_folder`,
+        callback: callback,
+    });
 }
 
 api.albums.callback_follow =
@@ -154,25 +181,31 @@ api.bookmarks = {};
 api.bookmarks.create =
 function create(b_url, title, callback)
 {
-    const url = "/bookmarks/create_bookmark";
+    return http.post({
-    const data = {"url": b_url.trim(), "title": title};
+        url: "/bookmarks/create_bookmark",
-    return common.post(url, data, callback);
+        data: {"url": b_url.trim(), "title": title},
+        callback: callback,
+    });
 }
 
 api.bookmarks.delete =
 function _delete(bookmark_id, callback)
 {
-    const url = `/bookmark/${bookmark_id}/delete`;
+    return http.post({
-    const data = {};
+        url: `/bookmark/${bookmark_id}/delete`,
-    return common.post(url, data, callback);
+        data: {},
+        callback: callback,
+    });
 }
 
 api.bookmarks.edit =
 function edit(bookmark_id, title, b_url, callback)
 {
-    const url = `/bookmark/${bookmark_id}/edit`;
+    return http.post({
-    const data = {"title": title.trim(), "url": b_url.trim()};
+        url: `/bookmark/${bookmark_id}/edit`,
-    return common.post(url, data, callback);
+        data: {"title": title.trim(), "url": b_url.trim()},
+        callback: callback,
+    });
 }
 
 /**************************************************************************************************/
@@ -181,81 +214,101 @@ api.photos = {};
 api.photos.add_tag =
 function add_tag(photo_id, tagname, callback)
 {
-    const url = `/photo/${photo_id}/add_tag`;
+    return http.post({
-    const data = {"tagname": tagname};
+        url: `/photo/${photo_id}/add_tag`,
-    return common.post(url, data, callback);
+        data: {"tagname": tagname},
+        callback: callback,
+    });
 }
 
 api.photos.batch_add_tag =
 function batch_add_tag(photo_ids, tagname, callback)
 {
-    const url = "/batch/photos/add_tag";
+    return http.post({
-    const data = {"photo_ids": photo_ids.join(","), "tagname": tagname};
+        url: "/batch/photos/add_tag",
-    return common.post(url, data, add_remove_tag_callback);
+        data: {"photo_ids": photo_ids.join(","), "tagname": tagname},
+        add_remove_tag_callback: callback,
+    });
 }
 
 api.photos.batch_refresh_metadata =
 function batch_refresh_metadata(photo_ids, callback)
 {
-    const url = "/batch/photos/refresh_metadata";
+    return http.post({
-    const data = {"photo_ids": photo_ids.join(",")};
+        url: "/batch/photos/refresh_metadata",
-    return common.post(url, data, callback);
+        data: {"photo_ids": photo_ids.join(",")},
+        callback: callback,
+    });
 }
 
 api.photos.batch_remove_tag =
 function batch_remove_tag(photo_ids, tagname, callback)
 {
-    const url = "/batch/photos/remove_tag";
+    return http.post({
-    const data = {"photo_ids": photo_ids.join(","), "tagname": tagname};
+        url: "/batch/photos/remove_tag",
-    return common.post(url, data, add_remove_tag_callback);
+        data: {"photo_ids": photo_ids.join(","), "tagname": tagname},
+        add_remove_tag_callback: callback,
+    });
 }
 
 api.photos.batch_set_searchhidden =
 function batch_set_searchhidden(photo_ids, callback)
 {
-    const url = "/batch/photos/set_searchhidden";
+    return http.post({
-    const data = {"photo_ids": photo_ids.join(",")};
+        url: "/batch/photos/set_searchhidden",
-    return common.post(url, data, callback);
+        data: {"photo_ids": photo_ids.join(",")},
+        callback: callback,
+    });
 }
 
 api.photos.batch_unset_searchhidden =
 function batch_unset_searchhidden(photo_ids, callback)
 {
-    const url = "/batch/photos/unset_searchhidden";
+    return http.post({
-    const data = {"photo_ids": photo_ids.join(",")};
+        url: "/batch/photos/unset_searchhidden",
-    return common.post(url, data, callback);
+        data: {"photo_ids": photo_ids.join(",")},
+        callback: callback,
+    });
 }
 
 api.photos.copy_tags =
 function copy_tags(photo_id, other_photo, callback)
 {
-    const url = `/photo/${photo_id}/copy_tags`;
+    return http.post({
-    const data = {"other_photo": other_photo};
+        url: `/photo/${photo_id}/copy_tags`,
-    return common.post(url, data, callback)
+        data: {"other_photo": other_photo},
+        callback: callback,
+    });
 }
 
 api.photos.delete =
 function _delete(photo_id, delete_file, callback)
 {
-    const url = `/photo/${photo_id}/delete`;
+    return http.post({
-    const data = {"delete_file": delete_file};
+        url: `/photo/${photo_id}/delete`,
-    return common.post(url, data, callback);
+        data: {"delete_file": delete_file},
+        callback: callback,
+    });
 }
 
 api.photos.generate_thumbnail =
 function generate_thumbnail(photo_id, special, callback)
 {
-    const url = `/photo/${photo_id}/generate_thumbnail`
+    return http.post({
-    const data = special;
+        url: `/photo/${photo_id}/generate_thumbnail`,
-    return common.post(url, data, callback);
+        data: special,
+        callback: callback,
+    });
 }
 
 api.photos.get_download_zip_token =
 function get_download_zip_token(photo_ids, callback)
 {
-    const url = "/batch/photos/download_zip";
+    return http.post({
-    const data = {"photo_ids": photo_ids.join(",")};
+        url: "/batch/photos/download_zip",
-    return common.post(url, data, callback);
+        data: {"photo_ids": photo_ids.join(",")},
+        callback: callback,
+    });
 }
 
 api.photos.download_zip =
@@ -275,16 +328,20 @@ function callback_download_zip(response)
 api.photos.refresh_metadata =
 function refresh_metadata(photo_id, callback)
 {
-    const url = `/photo/${photo_id}/refresh_metadata`;
+    return http.post({
-    return common.post(url, null, callback);
+        url: `/photo/${photo_id}/refresh_metadata`,
+        callback: callback,
+    });
 }
 
 api.photos.remove_tag =
 function remove_tag(photo_id, tagname, callback)
 {
-    const url = `/photo/${photo_id}/remove_tag`;
+    return http.post({
-    const data = {"tagname": tagname};
+        url: `/photo/${photo_id}/remove_tag`,
-    return common.post(url, data, callback);
+        data: {"tagname": tagname},
+        callback: callback,
+    });
 }
 
 api.photos.search =
@@ -296,28 +353,37 @@ function search(parameters, callback)
     {
         url += "?" + parameters;
     }
-    return common.get(url, callback)
+    return http.get({
+        url: url,
+        callback: callback,
+    });
 }
 
 api.photos.set_searchhidden =
 function set_searchhidden(photo_id, callback)
 {
-    const url = `/photo/${photo_id}/set_searchhidden`;
+    return http.post({
-    return common.post(url, null, callback);
+        url: `/photo/${photo_id}/set_searchhidden`,
+        callback: callback,
+    });
 }
 
 api.photos.unset_searchhidden =
 function unset_searchhidden(photo_id, callback)
 {
-    const url = `/photo/${photo_id}/unset_searchhidden`;
+    return http.post({
-    return common.post(url, null, callback);
+        url: `/photo/${photo_id}/unset_searchhidden`,
+        callback: callback,
+    });
 }
 
 api.photos.show_in_folder =
 function show_in_folder(photo_id, callback)
 {
-    const url = `/photo/${photo_id}/show_in_folder`;
+    return http.post({
-    return common.post(url, null, callback);
+        url: `/photo/${photo_id}/show_in_folder`,
+        callback: callback,
+    });
 }
 
 api.photos.callback_go_to_search =
@@ -337,71 +403,89 @@ api.tags = {};
 api.tags.add_child =
 function add_child(tag_name, child_name, callback)
 {
-    const url = `/tag/${tag_name}/add_child`;
+    return http.post({
-    const data = {"child_name": child_name};
+        url: `/tag/${tag_name}/add_child`,
-    return common.post(url, data, callback);
+        data: {"child_name": child_name},
+        callback: callback,
+    });
 }
 
 api.tags.add_synonym =
 function add_synonym(tag_name, syn_name, callback)
 {
-    const url = `/tag/${tag_name}/add_synonym`;
+    return http.post({
-    const data = {"syn_name": syn_name};
+        url: `/tag/${tag_name}/add_synonym`,
-    return common.post(url, data, callback);
+        data: {"syn_name": syn_name},
+        callback: callback,
+    });
 }
 
 api.tags.create =
 function create(name, description, callback)
 {
-    const url = `/tags/create_tag`;
+    return http.post({
-    const data = {"name": name, "description": description};
+        url: `/tags/create_tag`,
-    return common.post(url, data, callback);
+        data: {"name": name, "description": description},
+        callback: callback,
+    });
 }
 
 api.tags.delete =
 function _delete(tag_name, callback)
 {
-    const url = `/tag/${tag_name}/delete`;
+    return http.post({
-    return common.post(url, null, callback);
+        url: `/tag/${tag_name}/delete`,
+        callback: callback,
+    });
 }
 
 api.tags.easybake =
 function easybake(easybake_string, callback)
 {
-    const url = "/tags/easybake";
+    return http.post({
-    const data = {"easybake_string": easybake_string};
+        url: "/tags/easybake",
-    return common.post(url, data, callback);
+        data: {"easybake_string": easybake_string},
+        callback: callback,
+    });
 }
 
 api.tags.edit =
 function edit(tag_name, name, description, callback)
 {
-    const url = `/tag/${tag_name}/edit`;
+    return http.post({
-    const data = {"name": name, "description": description};
+        url: `/tag/${tag_name}/edit`,
-    return common.post(url, data, callback);
+        data: {"name": name, "description": description},
+        callback: callback,
+    });
 }
 
 api.tags.get_all_tags =
 function get_all_tags(callback)
 {
-    const url = "/all_tags.json";
+    return http.get({
-    return common.get(url, callback);
+        url: "/all_tags.json",
+        callback: callback,
+    });
 }
 
 api.tags.remove_child =
 function remove_child(tag_name, child_name, callback)
 {
-    const url = `/tag/${tag_name}/remove_child`;
+    return http.post({
-    const data = {"child_name": child_name};
+        url: `/tag/${tag_name}/remove_child`,
-    return common.post(url, data, callback);
+        data: {"child_name": child_name},
+        callback: callback,
+    });
 }
 
 api.tags.remove_synonym =
 function remove_synonym(tag_name, syn_name, callback)
 {
-    const url = `/tag/${tag_name}/remove_synonym`;
+    return http.post({
-    const data = {"syn_name": syn_name};
+        url: `/tag/${tag_name}/remove_synonym`,
-    return common.post(url, data, callback);
+        data: {"syn_name": syn_name},
+        callback: callback,
+    });
 }
 
 api.tags.callback_go_to_tags =
@@ -421,35 +505,44 @@ api.users = {};
 api.users.edit =
 function edit(username, display_name, callback)
 {
-    const url = `/user/${username}/edit`;
+    return http.post({
-    const data = {"display_name": display_name};
+        url: `/user/${username}/edit`,
-    return common.post(url, data, callback);
+        data: {"display_name": display_name},
+        callback: callback,
+    });
 }
 
 api.users.login =
 function login(username, password, callback)
 {
-    const url = "/login";
+    return http.post({
-    const data = {"username": username, "password": password};
+        url: "/login",
-    return common.post(url, data, callback);
+        data: {"username": username, "password": password},
+        callback: callback,
+    });
 }
 
 api.users.logout =
 function logout(callback)
 {
-    const url = "/logout";
+    return http.post({
-    return common.post(url, null, callback);
+        url: "/logout",
+        callback: callback,
+    });
 }
 
 api.users.register =
 function register(username, display_name, password_1, password_2, callback)
 {
-    const url = "/register";
     const data = {
         "username": username,
         "display_name": display_name,
         "password_1": password_1,
         "password_2": password_2,
     };
-    return common.post(url, data, callback);
+    return http.post({
+        url: "/register",
+        data: data,
+        callback: callback,
+    });
 }

frontends/etiquette_flask/static/js/common.js

@@ -57,146 +57,18 @@ function refresh_or_alert(response)
     window.location.reload();
 }
 
-////////////////////////////////////////////////////////////////////////////////////////////////////
-// HTTP ////////////////////////////////////////////////////////////////////////////////////////////
-////////////////////////////////////////////////////////////////////////////////////////////////////
-
-common.formdata =
-function formdata(data)
-{
-    fd = new FormData();
-    for (let [key, value] of Object.entries(data))
-    {
-        if (value === undefined)
-        {
-            continue;
-        }
-        if (value === null)
-        {
-            value = '';
-        }
-        fd.append(key, value);
-    }
-    return fd;
-}
-
-common._request =
-function _request(method, url, callback)
-{
-    /*
-    Perform an HTTP request and call the `callback` with the response.
-
-    The response will have the following structure:
-    {
-        "meta": {
-            "completed": true / false,
-            "status": If the connection failed or request otherwise could not
-                complete, `status` will be 0. If the request completed,
-                `status` will be the HTTP response code.
-            "json_ok": If the server responded with parseable json, `json_ok`
-                will be true, and that data will be in `response.data`. If the
-                server response was not parseable json, `json_ok` will be false
-                and `response.data` will be undefined.
-            "request_url": The URL exactly as given to this call.
-        }
-        "data": {JSON parsed from server response if json_ok}.
-    }
-
-    So, from most lenient to most strict, error catching might look like:
-    if response.meta.completed
-    if response.meta.json_ok
-    if response.meta.status === 200
-    if response.meta.status === 200 and response.meta.json_ok
-    */
-    const request = new XMLHttpRequest();
-    const response = {
-        "meta": {
-            "completed": false,
-            "status": 0,
-            "json_ok": false,
-            "request_url": url,
-        },
-    };
-
-    request.onreadystatechange = function()
-    {
-        /*
-        readystate values:
-        0 UNSENT / ABORTED
-        1 OPENED
-        2 HEADERS_RECEIVED
-        3 LOADING
-        4 DONE
-        */
-        if (request.readyState != 4)
-            {return;}
-
-        if (callback == null)
-            {return;}
-
-        response.meta.status = request.status;
-
-        if (request.status != 0)
-        {
-            response.meta.completed = true;
-            try
-            {
-                response.data = JSON.parse(request.responseText);
-                response.meta.json_ok = true;
-            }
-            catch (exc)
-            {
-                response.meta.json_ok = false;
-            }
-        }
-        callback(response);
-    };
-    const asynchronous = true;
-    request.open(method, url, asynchronous);
-    return request;
-}
-
-common.get =
-function get(url, callback)
-{
-    request = common._request("GET", url, callback);
-    request.send();
-    return request;
-}
-
-common.post =
-function post(url, data, callback)
-{
-    /*
-    `data`:
-        a FormData object which you have already filled with values, or a
-        dictionary from which a FormData will be made, using common.formdata.
-    */
-    if (data instanceof FormData || data === null)
-    {
-        ;
-    }
-    else
-    {
-        data = common.formdata(data);
-    }
-    request = common._request("POST", url, callback);
-    request.send(data);
-    return request;
-}
-
 ////////////////////////////////////////////////////////////////////////////////////////////////////
 // STRING TOOLS ////////////////////////////////////////////////////////////////////////////////////
 ////////////////////////////////////////////////////////////////////////////////////////////////////
 
 common.join_and_trail =
-function join_and_trail(l, s)
+function join_and_trail(list, separator)
 {
-    if (l.length === 0)
+    if (list.length === 0)
     {
         return "";
     }
-    return l.join(s) + s
+    return list.join(separator) + separator
 }
 
 ////////////////////////////////////////////////////////////////////////////////////////////////////

frontends/etiquette_flask/static/js/http.js

@@ -0,0 +1,210 @@
+const http = {};
+
+http.HEADERS = {};
+
+http.requests_in_flight = 0;
+
+http.request_queue = {};
+http.request_queue.array = [];
+
+http.request_queue.push =
+function request_queue_push(func)
+{
+    http.request_queue.array.push(func)
+    if (http.requests_in_flight == 0)
+    {
+        http.request_queue_next();
+    }
+}
+
+http.request_queue.unshift =
+function request_queue_unshift(func)
+{
+    http.request_queue.array.unshift(func)
+    if (http.requests_in_flight == 0)
+    {
+        http.request_queue_next();
+    }
+}
+http.request_queue.pushleft = http.request_queue.unshift;
+
+http.request_queue_next =
+function request_queue_next()
+{
+    if (http.requests_in_flight > 0)
+    {
+        return;
+    }
+    if (http.request_queue.array.length === 0)
+    {
+        return;
+    }
+    const func = http.request_queue.array.shift();
+    func();
+}
+
+http.formdata =
+function formdata(data)
+{
+    const fd = new FormData();
+    for (let [key, value] of Object.entries(data))
+    {
+        if (value === undefined)
+        {
+            continue;
+        }
+        if (value === null)
+        {
+            value = '';
+        }
+        fd.append(key, value);
+    }
+    return fd;
+}
+
+http._request =
+function _request(kwargs)
+{
+    /*
+    Perform an HTTP request and call the `callback` with the response.
+
+    The response will have the following structure:
+    {
+        "meta": {
+            "request": the XMLHttpRequest object,
+            "completed": true / false,
+            "status": If the connection failed or request otherwise could not
+                complete, `status` will be 0. If the request completed,
+                `status` will be the HTTP response code.
+            "json_ok": If the server responded with parseable json, `json_ok`
+                will be true, and that data will be in `response.data`. If the
+                server response was not parseable json, `json_ok` will be false
+                and `response.data` will be undefined.
+            "kwargs": The kwargs exactly as given to this call.
+        }
+        "data": {JSON parsed from server response if json_ok},
+        "retry": function you can call to retry the request.
+    }
+
+    So, from most lenient to most strict, error catching might look like:
+    if response.meta.completed
+    if response.meta.json_ok
+    if response.meta.status === 200
+    if response.meta.status === 200 and response.meta.json_ok
+    */
+    const request = new XMLHttpRequest();
+    const response = {
+        "meta": {
+            "request": request,
+            "completed": false,
+            "status": 0,
+            "json_ok": false,
+            "kwargs": kwargs,
+        },
+        "retry": function(){http._request(kwargs)},
+    };
+
+    request.onreadystatechange = function()
+    {
+        /*
+        readystate values:
+        0 UNSENT / ABORTED
+        1 OPENED
+        2 HEADERS_RECEIVED
+        3 LOADING
+        4 DONE
+        */
+        if (request.readyState != 4)
+        {
+            return;
+        }
+
+        http.requests_in_flight -= 1;
+        setTimeout(http.request_queue_next, 0);
+
+        if (kwargs["callback"] == null)
+        {
+            return;
+        }
+
+        response.meta.status = request.status;
+
+        if (request.status != 0)
+        {
+            response.meta.completed = true;
+            try
+            {
+                response.data = JSON.parse(request.responseText);
+                response.meta.json_ok = true;
+            }
+            catch (exc)
+            {
+                response.meta.json_ok = false;
+            }
+        }
+        kwargs["callback"](response);
+    };
+
+    // Headers
+
+    const asynchronous = "asynchronous" in kwargs ? kwargs["asynchronous"] : true;
+    request.open(kwargs["method"], kwargs["url"], asynchronous);
+
+    for (const [header, value] of Object.entries(http.HEADERS))
+    {
+        request.setRequestHeader(header, value);
+    }
+
+    const more_headers = kwargs["headers"] || {};
+    for (const [header, value] of Object.entries(more_headers))
+    {
+        request.setRequestHeader(header, value);
+    }
+
+    if (kwargs["with_credentials"])
+    {
+        request.withCredentials = true;
+    }
+
+    // Send
+
+    let data = kwargs["data"];
+    if (data === undefined || data === null)
+    {
+        request.send();
+    }
+    else if (data instanceof FormData)
+    {
+        request.send(data);
+    }
+    else if (typeof(data) === "string" || data instanceof String)
+    {
+        request.send(data);
+    }
+    else
+    {
+        request.send(http.formdata(data));
+    }
+    http.requests_in_flight += 1;
+
+    return request;
+}
+
+http.get =
+function get(kwargs)
+{
+    kwargs["method"] = "GET";
+    return http._request(kwargs);
+}
+
+http.post =
+function post(kwargs)
+{
+    /*
+    `data`:
+        a FormData object which you have already filled with values, or a
+        dictionary from which a FormData will be made, using http.formdata.
+    */
+    kwargs["method"] = "POST";
+    return http._request(kwargs);
+}

frontends/etiquette_flask/templates/admin.html

@@ -11,6 +11,7 @@
     {% if theme %}<link rel="stylesheet" href="/static/css/theme_{{theme}}.css">{% endif %}
     <script src="/static/js/common.js"></script>
     <script src="/static/js/api.js"></script>
+    <script src="/static/js/http.js"></script>
 
 <style>
 </style>

frontends/etiquette_flask/templates/album.html

@@ -93,6 +93,7 @@
     <script src="/static/js/common.js"></script>
     <script src="/static/js/api.js"></script>
     <script src="/static/js/cards.js"></script>
+    <script src="/static/js/http.js"></script>
 
 {{shared_css()}}
 </head>
@@ -151,6 +152,7 @@ const ALBUM_ID = undefined;
     <script src="/static/js/album_autocomplete.js"></script>
     <script src="/static/js/cards.js"></script>
     <script src="/static/js/contextmenus.js"></script>
+    <script src="/static/js/http.js"></script>
     <script src="/static/js/spinners.js"></script>
     <script src="/static/js/editor.js"></script>
     <script src="/static/js/hotkeys.js"></script>

frontends/etiquette_flask/templates/bookmarks.html

@@ -14,6 +14,7 @@
     <script src="/static/js/common.js"></script>
     <script src="/static/js/api.js"></script>
     <script src="/static/js/cards.js"></script>
+    <script src="/static/js/http.js"></script>
     <script src="/static/js/spinners.js"></script>
     <script src="/static/js/editor.js"></script>
 

frontends/etiquette_flask/templates/clipboard.html

@@ -16,6 +16,7 @@
     <script src="/static/js/api.js"></script>
     <script src="/static/js/cards.js"></script>
     <script src="/static/js/hotkeys.js"></script>
+    <script src="/static/js/http.js"></script>
     <script src="/static/js/photo_clipboard.js"></script>
     <script src="/static/js/spinners.js"></script>
     <script src="/static/js/tag_autocomplete.js"></script>
@@ -239,7 +240,11 @@ function request_more_divs()
         }
         refresh_divs();
     }
-    common.post(url, data, callback);
+    http.post({
+        url: url,
+        data: data,
+        callback: callback,
+    });
 }
 
 function my_clipboard_load_save_hook()

frontends/etiquette_flask/templates/login.html

@@ -11,6 +11,7 @@
     {% if theme %}<link rel="stylesheet" href="/static/css/theme_{{theme}}.css">{% endif %}
     <script src="/static/js/common.js"></script>
     <script src="/static/js/api.js"></script>
+    <script src="/static/js/http.js"></script>
 
 <style>
 input

frontends/etiquette_flask/templates/photo.html

@@ -14,6 +14,7 @@
     <script src="/static/js/common.js"></script>
     <script src="/static/js/api.js"></script>
     <script src="/static/js/hotkeys.js"></script>
+    <script src="/static/js/http.js"></script>
     <script src="/static/js/photo_clipboard.js"></script>
     <script src="/static/js/spinners.js"></script>
     <script src="/static/js/tag_autocomplete.js"></script>

frontends/etiquette_flask/templates/root.html

@@ -10,6 +10,7 @@
     {% if theme %}<link rel="stylesheet" href="/static/css/theme_{{theme}}.css">{% endif %}
     <script src="/static/js/common.js"></script>
     <script src="/static/js/api.js"></script>
+    <script src="/static/js/http.js"></script>
 
 <style>
 body

frontends/etiquette_flask/templates/search.html

@@ -16,6 +16,7 @@
     <script src="/static/js/common.js"></script>
     <script src="/static/js/api.js"></script>
     <script src="/static/js/hotkeys.js"></script>
+    <script src="/static/js/http.js"></script>
     <script src="/static/js/photo_clipboard.js"></script>
     <script src="/static/js/tag_autocomplete.js"></script>
 

frontends/etiquette_flask/templates/swipe.html

@@ -16,6 +16,7 @@
     <script src="/static/js/api.js"></script>
     <script src="/static/js/cards.js"></script>
     <script src="/static/js/hotkeys.js"></script>
+    <script src="/static/js/http.js"></script>
     <script src="/static/js/photo_clipboard.js"></script>
     <script src="/static/js/spinners.js"></script>
     <script src="/static/js/tag_autocomplete.js"></script>

frontends/etiquette_flask/templates/tags.html

@@ -18,6 +18,7 @@
     <script src="/static/js/common.js"></script>
     <script src="/static/js/api.js"></script>
     <script src="/static/js/editor.js"></script>
+    <script src="/static/js/http.js"></script>
     <script src="/static/js/spinners.js"></script>
     <script src="/static/js/tag_autocomplete.js"></script>
 

frontends/etiquette_flask/templates/template.html

@@ -11,6 +11,7 @@
     {% if theme %}<link rel="stylesheet" href="/static/css/theme_{{theme}}.css">{% endif %}
     <script src="/static/js/common.js"></script>
     <script src="/static/js/api.js"></script>
+    <script src="/static/js/http.js"></script>
 
 <style>
 </style>

frontends/etiquette_flask/templates/user.html

@@ -14,6 +14,7 @@
     <script src="/static/js/common.js"></script>
     <script src="/static/js/api.js"></script>
     <script src="/static/js/editor.js"></script>
+    <script src="/static/js/http.js"></script>
     <script src="/static/js/spinners.js"></script>
 
 <style>