From ea5a02f8b61da7799297adfc7a480db8a68ae509 Mon Sep 17 00:00:00 2001
From: Ethan Dalool <git@voussoir.net>
Date: Thu, 7 Jan 2021 20:18:07 -0800
Subject: [PATCH] Use update_dynamic_elements for user name, clipboard count.

---
 .../etiquette_flask/static/js/photo_clipboard.js     | 12 +-----------
 frontends/etiquette_flask/templates/clipboard.html   |  2 +-
 .../etiquette_flask/templates/clipboard_tray.html    |  2 +-
 frontends/etiquette_flask/templates/header.html      |  2 +-
 frontends/etiquette_flask/templates/user.html        |  6 +++---
 5 files changed, 7 insertions(+), 17 deletions(-)

diff --git a/frontends/etiquette_flask/static/js/photo_clipboard.js b/frontends/etiquette_flask/static/js/photo_clipboard.js
index 256df84..6d0eeba 100644
--- a/frontends/etiquette_flask/static/js/photo_clipboard.js
+++ b/frontends/etiquette_flask/static/js/photo_clipboard.js
@@ -379,16 +379,6 @@ function open_full_clipboard_tab()
     window.open("/clipboard");
 }
 
-photo_clipboard.update_clipboard_count =
-function update_clipboard_count()
-{
-    const elements = document.getElementsByClassName("clipboard_count");
-    for (const element of elements)
-    {
-        element.innerText = photo_clipboard.clipboard.size;
-    }
-}
-
 photo_clipboard.on_storage_event =
 function on_storage_event()
 {
@@ -405,7 +395,7 @@ function update_pagestate()
     /*
     Update all relevant DOM elements to match internal state.
     */
-    photo_clipboard.update_clipboard_count();
+    common.update_dynamic_elements("dynamic_clipboard_count", photo_clipboard.clipboard.size);
     photo_clipboard.update_clipboard_tray();
     photo_clipboard.apply_check_all();
 }
diff --git a/frontends/etiquette_flask/templates/clipboard.html b/frontends/etiquette_flask/templates/clipboard.html
index c49887f..5fd7fd5 100644
--- a/frontends/etiquette_flask/templates/clipboard.html
+++ b/frontends/etiquette_flask/templates/clipboard.html
@@ -95,7 +95,7 @@
 {{header.make_header(session=session)}}
 <div id="content_body" class="sticky_side_right sticky_bottom_right">
 <div id="left">
-    <div class="panel">The clipboard contains <span class="clipboard_count">0</span> items.
+    <div class="panel">The clipboard contains <span class="dynamic_clipboard_count">0</span> items.
         <button id="clear_clipboard_button" class="red_button" onclick="return photo_clipboard.clear_clipboard();">Clear it.</button>
     </div>
 
diff --git a/frontends/etiquette_flask/templates/clipboard_tray.html b/frontends/etiquette_flask/templates/clipboard_tray.html
index 6fe941b..1aeeb02 100644
--- a/frontends/etiquette_flask/templates/clipboard_tray.html
+++ b/frontends/etiquette_flask/templates/clipboard_tray.html
@@ -4,7 +4,7 @@
     id="clipboard_tray_expandbutton"
     class="yellow_button"
     onclick="return photo_clipboard.clipboard_tray_collapse_toggle();"
-    >Clipboard: <span class="clipboard_count">0</span> items</button>
+    >Clipboard: <span class="dynamic_clipboard_count">0</span> items</button>
     <div id="clipboard_tray_body" class="hidden">
         <div id="clipboard_tray_toolbox">
             <span id="clipboard_tray_toolbox_firstline">
diff --git a/frontends/etiquette_flask/templates/header.html b/frontends/etiquette_flask/templates/header.html
index 89a20a9..406f628 100644
--- a/frontends/etiquette_flask/templates/header.html
+++ b/frontends/etiquette_flask/templates/header.html
@@ -4,7 +4,7 @@
     <a class="header_element" href="/search">Search</a>
     <a class="header_element" href="/tags">Tags</a>
     {% if session.user %}
-    <a class="header_element" href="/user/{{session.user.username}}">{{session.user.display_name}}</a>
+    <a class="header_element dynamic_user_display_name" href="/user/{{session.user.username}}">{{session.user.display_name}}</a>
     <button class="header_element" onclick="return api.users.logout(common.refresh);" style="flex:0">Logout</button>
     {% else %}
     <a class="header_element" href="/login">Log in</a>
diff --git a/frontends/etiquette_flask/templates/user.html b/frontends/etiquette_flask/templates/user.html
index 32be541..ad58222 100644
--- a/frontends/etiquette_flask/templates/user.html
+++ b/frontends/etiquette_flask/templates/user.html
@@ -2,7 +2,7 @@
 <html>
 <head>
     {% import "header.html" as header %}
-    <title>{{user.display_name}}</title>
+    <title class="dynamic_user_display_name">{{user.display_name}}</title>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
     <link rel="stylesheet" href="/static/css/common.css">
@@ -36,7 +36,7 @@ h2, h3
             <p>User since <span title="{{user.created|int|timestamp_to_8601}}">{{user.created|timestamp_to_naturaldate}}.</span></p>
         </div>
         <div class="panel">
-            <h3><a href="/search?author={{user.username}}">Photos by {{user.display_name}}</a></h3>
+            <h3><a href="/search?author={{user.username}}">Photos by <span class="dynamic_user_display_name">{{user.display_name}}</span></a></h3>
             <iframe
             class="embedded_search"
             src="/search_embed?author={{user.username}}&orderby=created-desc&yield_albums=no&limit=10"
@@ -72,7 +72,7 @@ function profile_ed_on_save(ed)
 
         // The data that comes back from the server will have been normalized.
         const new_display_name = response.data.display_name;
-        document.title = new_display_name;
+        common.update_dynamic_elements("dynamic_user_display_name", new_display_name);
 
         ed.elements["display_name"].edit.value = new_display_name;