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

Add search_embed for bringing search iframes to other pages.

Browse source
This commit is contained in:
voussoir 2021-01-02 13:49:43 -08:00
parent 732c054075
commit 0c3ee6f2d2
6 changed files with 86 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
frontends/etiquette_flask/backend/endpoints/photo_endpoints.py
View file

@ -452,6 +452,17 @@ def get_search_core():
} }
return final_results return final_results
@site.route('/search_embed')
def get_search_embed():
search_results = get_search_core()
response = common.render_template(
request,
'search_embed.html',
results=search_results['results'],
search_kwargs=search_results['search_kwargs'],
)
return response
@site.route('/search') @site.route('/search')
def get_search_html(): def get_search_html():
search_results = get_search_core() search_results = get_search_core()

7
frontends/etiquette_flask/static/css/etiquette.css
View file

@ -15,6 +15,13 @@ input, select, textarea
border-radius: 2px; border-radius: 2px;
} }
iframe.embedded_search
{
width: 100%;
max-height: 500px;
border: none;
}
.header_element:hover .header_element:hover
{ {
background-color: var(--color_secondary); background-color: var(--color_secondary);

6
frontends/etiquette_flask/static/js/common.js
View file

@ -165,6 +165,12 @@ function html_to_element(html)
return template.content.firstElementChild; return template.content.firstElementChild;
} }
common.size_iframe_to_content =
function size_iframe_to_content(iframe)
{
iframe.style.height = iframe.contentWindow.document.documentElement.scrollHeight + 'px';
}
//////////////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////////////////////////////
// HOOKS & ADD-ONS ///////////////////////////////////////////////////////////////////////////////// // HOOKS & ADD-ONS /////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////////////////////////////

31
frontends/etiquette_flask/templates/search_embed.html Normal file
View file

@ -0,0 +1,31 @@
<!DOCTYPE html5>
<html>
<head>
<link rel="stylesheet" href="/static/css/common.css">
<link rel="stylesheet" href="/static/css/etiquette.css">
<link rel="stylesheet" href="/static/css/photo_card.css">
{% if theme %}<link rel="stylesheet" href="/static/css/theme_{{theme}}.css">{% endif %}
<style>
body
{
background-color: initial;
}
</style>
</head>
<body>
<div>
{% import "photo_card.html" as photo_card %}
{% import "album_card.html" as album_card %}
{% for result in results %}
{% if result.__class__.__name__ == 'Photo' %}
{{photo_card.create_photo_card(result, view=search_kwargs["view"])}}
{% elif result.__class__.__name__ == 'Album' %}
{{album_card.create_album_card(result, view=search_kwargs["view"])}}
{% endif %}
{% endfor %}
</div>
</body>
</html>

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

@ -233,6 +233,18 @@ h2, h3
</div> </div>
{% endif %} <!-- if synonyms --> {% endif %} <!-- if synonyms -->
{% endif %} <!-- if specific tag and include synonyms --> {% endif %} <!-- if specific tag and include synonyms -->
{% if specific_tag %}
<div id="hierarchy_recentphotos" class="panel">
<h3><a href="/search?tag_musts={{specific_tag.name}}&orderby=tagged_at-desc">Recent photos</a></h3>
<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>
</div>
{% endif %} <!-- if specific tag -->
</div> </div>
</div> </div>
</body> </body>

25
frontends/etiquette_flask/templates/user.html
View file

@ -14,10 +14,15 @@
<script src="/static/js/spinner.js"></script> <script src="/static/js/spinner.js"></script>
<style> <style>
h2, h3
{
margin-top: 0;
}
#content_body #content_body
{ {
/* overriding common.css here */ grid-row-gap: 8px;
display: block; grid-auto-rows: max-content;
} }
</style> </style>
</head> </head>
@ -26,10 +31,18 @@
{{header.make_header(session=session)}} {{header.make_header(session=session)}}
<div id="content_body"> <div id="content_body">
<div class="panel"> <div class="panel">
<h2 id="display_name">{{user.display_name}}</h2> <h2 id="display_name">{{user.display_name}}</h2>
<p>ID: <a href="/userid/{{user.id}}">{{user.id}}</a></p> <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> <p>User since <span title="{{user.created|int|timestamp_to_8601}}">{{user.created|timestamp_to_naturaldate}}.</span></p>
<p><a href="/search?author={{user.username}}">Photos by {{user.display_name}}</a></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>
</div> </div>
</body> </body>