<!DOCTYPE html5> <html> <head> {% import "header.html" as header %} <title>{{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"> <link rel="stylesheet" href="/static/css/etiquette.css"> {% 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/editor.js"></script> <script src="/static/js/spinner.js"></script> <style> h2, h3 { margin-top: 0; } #content_body { grid-row-gap: 8px; grid-auto-rows: max-content; } </style> </head> <body> {{header.make_header(session=session)}} <div id="content_body"> <div class="panel"> <h2 id="display_name">{{user.display_name}}</h2> <p>ID: <a href="/userid/{{user.id}}">{{user.id}}</a></p> <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> <iframe class="embedded_search" src="/search_embed?author={{user.username}}&orderby=created-desc&yield_albums=no&limit=10" onload="return common.size_iframe_to_content(this);" > </iframe> </div> </div> </body> <script type="text/javascript"> {% if user.id == session.user.id %} const USERNAME = "{{user.username}}"; profile_ed_on_open = undefined; function profile_ed_on_save(ed) { function callback(response) { ed.hide_spinner(); if (! response.meta.json_ok) { alert(JSON.stringify(response)); return; } if ("error_type" in response.data) { ed.show_error(response.data.error_message); return; } // 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; ed.elements["display_name"].edit.value = new_display_name; ed.save(); } ed.show_spinner(); api.users.edit(USERNAME, ed.elements["display_name"].edit.value, callback); } profile_ed_on_cancel = undefined; const profile_ed_elements = [ { "id": "display_name", "element": document.getElementById("display_name"), "placeholder": "Display name", "empty_text": USERNAME, "autofocus": true, }, ]; const profile_ed = new editor.Editor( profile_ed_elements, profile_ed_on_open, profile_ed_on_save, profile_ed_on_cancel, ); {% endif %} </script> </html>