voussoir/etiquette
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Show recently tagged photos using js cards instead of iframe.

Browse source
This commit is contained in:
voussoir 2022-11-06 22:52:38 -08:00
parent de2bf6a81a
commit 9f8dd057f0
1 changed files with 35 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
frontends/etiquette_flask/templates/tags.html
View file

@ -17,6 +17,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/cards.js"></script>
<script src="/static/js/editor.js"></script>
<script src="/static/js/http.js"></script>
<script src="/static/js/spinners.js"></script>
@ -256,12 +257,7 @@
{% if specific_tag %}
<div id="hierarchy_recentphotos" class="panel">
<h2><a href="/search?tag_musts={{specific_tag.name}}&orderby=tagged_at-desc">Recent photos</a></h2>
<iframe
class="embedded_search"
src="/search_embed?tag_musts={{specific_tag.name}}&orderby=tagged_at-desc&yield_albums=no&limit=10"
onload="return common.size_iframe_to_content(this);"
>
</iframe>
<span class="spinner hidden">⌛</span>
</div> <!-- hierarchy_recentphotos -->
{% endif %} <!-- if specific tag -->
</div>
@ -276,6 +272,30 @@ const easybake_button = document.getElementById('easybake_button');
const message_area = document.getElementById('message_area');
common.bind_box_to_button(easybake_input, easybake_button, false);
// UI
function search_recent_photos()
{
const div = document.getElementById("hierarchy_recentphotos");
const spinner = div.querySelector(".spinner");
spinner.classList.remove("hidden");
function callback(response)
{
spinner.classList.add("hidden");
const count = response.data.results.length + (response.data.more_after_limit ? "+" : "");
div.querySelector("h2").prepend(count + " ");
for (const photo of response.data.results)
{
div.append(cards.photos.create(photo, "grid"));
}
}
const parameters = new URLSearchParams();
parameters.set("tag_musts", SPECIFIC_TAG);
parameters.set("orderby", "tagged_at-desc");
parameters.set("limit", "20");
api.photos.search(parameters, callback);
}
// BUTTON HANDLERS
function add_child_form(event)
@ -588,5 +608,14 @@ const rename_ed = new editor.Editor(
rename_ed_on_save,
);
{% endif %}
function on_pageload()
{
if (SPECIFIC_TAG)
{
search_recent_photos();
}
}
document.addEventListener("DOMContentLoaded", on_pageload);
</script>
</html>