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

Add filter to generate /file/ link with appropriate basename.

Browse source 
Because inlining the |urlencode every time is easy to forget.
This commit is contained in:
voussoir 2018-04-19 19:29:06 -07:00
parent bef91b3243
commit bdec6cf4a3
4 changed files with 20 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
frontends/etiquette_flask/etiquette_flask/common.py
View file

@ -33,6 +33,7 @@ site.jinja_env.add_extension('jinja2.ext.do')
site.jinja_env.trim_blocks = True
site.jinja_env.lstrip_blocks = True
site.jinja_env.filters['bytestring'] = jinja_filters.bytestring
site.jinja_env.filters['file_link'] = jinja_filters.file_link
site.debug = True
P = etiquette.photodb.PhotoDB()

9
frontends/etiquette_flask/etiquette_flask/jinja_filters.py
View file

@ -1,9 +1,16 @@
import etiquette
import jinja2.filters
import voussoirkit.bytestring
def bytestring(x):
try:
return voussoirkit.bytestring.bytestring(x)
except Exception:
except Exception as e:
return '??? b'
def file_link(photo, short=False):
if short:
return f'/file/{photo.id}{photo.dot_extension}'
basename = jinja2.filters.do_urlencode(photo.basename)
return f'/file/{photo.id}/{basename}'

19
frontends/etiquette_flask/templates/photo.html
View file

@ -8,8 +8,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" href="/static/css/common.css">
<script src="/static/js/common.js"></script>
{% set filename = photo.id + photo.dot_extension %}
{% set file_link = "/file/" + filename %}
<style>
#content_body
@ -192,13 +190,13 @@
<li>Dimensions: {{photo.width}}x{{photo.height}} px</li>
<li>Aspect ratio: {{photo.ratio}}</li>
{% endif %}
<li>Size: {{photo.bytestring}}</li>
<li>Size: {{photo.bytes|bytestring}}</li>
{% if photo.duration %}
<li>Duration: {{photo.duration_string}}</li>
<li>Overall Bitrate: {{photo.bitrate|int}} kbps</li>
{% endif %}
<li><a href="/file/{{photo.id}}{{photo.dot_extension}}?download=true&original_filename=true">Download as original filename</a></li>
<li><a href="/file/{{photo.id}}{{photo.dot_extension}}?download=true">Download as {{photo.id}}.{{photo.extension}}</a></li>
<li><a href="{{photo|file_link}}?download=true&original_filename=true">Download as original filename</a></li>
<li><a href="{{photo|file_link}}?download=true">Download as {{photo.id}}.{{photo.extension}}</a></li>
</ul>
<!-- CONTAINING ALBUMS -->
@ -228,17 +226,17 @@
<div id="photo_img_holder" onclick="toggle_hoverzoom(event)">
<img
id="photo_img"
src="{{file_link}}"
src="{{photo|file_link}}"
alt="{{photo.basename}}"
onload="this.style.opacity=0.99"
>
</div>
{% elif photo.simple_mimetype == "video" %}
<video src="{{file_link}}" controls preload=none {%if photo.thumbnail%}poster="/thumbnail/{{photo.id}}.jpg"{%endif%}></video>
<video src="{{photo|file_link}}" controls preload=none {%if photo.thumbnail%}poster="/thumbnail/{{photo.id}}.jpg"{%endif%}></video>
{% elif photo.simple_mimetype == "audio" %}
<audio src="{{file_link}}" controls></audio>
<audio src="{{photo|file_link}}" controls></audio>
{% else %}
<a href="{{file_link}}">View {{filename}}</a>
<a href="{{photo|file_link}}">View {{photo.basename}}</a>
{% endif %}
</div>
</div>
@ -316,6 +314,7 @@ function refresh_metadata(photoid)
post(url, data, callback);
}
var ZOOM_BG_URL = "url('{{photo|file_link(short=True)}}')";
function enable_hoverzoom(event)
{
//console.log("enable zoom");
@ -331,7 +330,7 @@ function enable_hoverzoom(event)
photo_img.style.opacity = "0";
photo_img.style.display = "none";
photo_img_holder.style.cursor = "zoom-out";
photo_img_holder.style.backgroundImage = "url('{{file_link}}')";
photo_img_holder.style.backgroundImage = ZOOM_BG_URL;
photo_img_holder.onmousemove = move_hoverzoom;
move_hoverzoom(event)
//setTimeout(function(){img_holder.onclick = toggle_hoverzoom;}, 100);

4
frontends/etiquette_flask/templates/photo_card.html
View file

@ -20,7 +20,7 @@
<div class="photo_card photo_card_list" data-id="{{photo.id}}">
<input type="checkbox" class="photo_card_selector_checkbox" onclick="on_photo_select(event)"/>
<span class="photo_card_filename"><a target="_blank" href="/photo/{{photo.id}}">{{photo.basename}}</a></span>
<a class="photo_card_metadata" target="_blank" href="/file/{{photo.id + photo.dot_extension}}">{{photo.bytestring}}</a>
<a class="photo_card_metadata" target="_blank" href="{{photo|file_link}}">{{photo.bytestring}}</a>
</div>
{% else -%}
@ -69,7 +69,7 @@
<span class="photo_card_metadata">
{{- metadata_inner|safe -}}
<a target="_blank" href="/file/{{photo.id + photo.dot_extension}}">{{photo.bytestring}}</a>
<a target="_blank" href="{{photo|file_link}}">{{photo.bytestring}}</a>
</span>
<input type="checkbox" class="photo_card_selector_checkbox" onclick="on_photo_select(event)"/>