Add image cache generation

This commit is contained in:
Michał Gdula 2023-03-26 20:58:17 +00:00
parent 2b795e520f
commit de79f5bc54
11 changed files with 126 additions and 96 deletions

View file

@ -30,7 +30,7 @@
</div>
{% else %}
<img
src="/api/file/{{ images.0.file_name }}?r=1920x1080"
src="/api/file/{{ images.0.file_name }}?r=prev"
onload="imgFade(this)"
style="opacity:0;"
/>
@ -58,7 +58,7 @@
<p class="image-subtitle"></p>
<p class="image-title"><span class="time">{{ image.created_at }}</span></p>
</div>
<img alt="{{ image.post_alt }}" data-src="{{ image.file_name }}" onload="imgFade(this)" style="opacity:0;" id="lazy-load"/>
<img alt="{{ image.post_alt }}" data-src="{{ image.file_name }}" onload="this.classList.add('loaded');" id="lazy-load"/>
</a>
{% endfor %}
</div>

View file

@ -29,7 +29,7 @@
<p class="image-subtitle"></p>
<p class="image-title">{{ group.name }}</p>
</div>
<img data-src="{{ group.thumbnail.file_name }}" onload="imgFade(this)" style="opacity:0;" id="lazy-load"/>
<img data-src="{{ group.thumbnail.file_name }}" onload="this.classList.add('loaded');" id="lazy-load"/>
</a>
{% else %}
<a id="group-{{ group.id }}" class="gallery-item" href="{{ url_for('group.group', group_id=group.id) }}">
@ -37,7 +37,7 @@
<p class="image-subtitle"></p>
<p class="image-title">{{ group.name }}</p>
</div>
<img src="{{ url_for('static', filename='error.png') }}" onload="imgFade(this)" style="opacity:0;"/>
<img src="{{ url_for('static', filename='error.png') }}" onload="this.classList.add('loaded');"/>
</a>
{% endif %}
{% endfor %}

View file

@ -91,6 +91,10 @@
alt="{{ image.post_alt }}"
onload="imgFade(this)" style="opacity:0;"
onerror="this.src='{{ url_for('static', filename='error.png')}}'"
{% if "File" in image.image_exif %}
width="{{ image.image_exif.File.Width.raw }}"
height="{{ image.image_exif.File.Height.raw }}"
{% endif %}
/>
</div>

View file

@ -41,7 +41,7 @@
<p class="image-subtitle"></p>
<p class="image-title"><span class="time">{{ image.created_at }}</span></p>
</div>
<img alt="{{ image.post_alt }}" data-src="{{ image.file_name }}" onload="imgFade(this)" style="opacity:0;" id="lazy-load"/>
<img alt="{{ image.post_alt }}" data-src="{{ image.file_name }}" onload="this.classList.add('loaded');" id="lazy-load"/>
</a>
{% endfor %}
</div>

View file

@ -61,7 +61,7 @@
<div class="wrapper">
<div class="navigation">
<img src="{{url_for('static', filename='icon.png')}}" alt="Logo" class="logo" onload="imgFade(this)" style="opacity:0;">
<img src="{{url_for('static', filename='icon.png')}}" alt="Logo" class="logo" onload="this.style.opacity=1;" style="opacity:0">
<a href="{{url_for('gallery.index')}}" class="navigation-item {% block nav_home %}{% endblock %}">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M208,32H80A16,16,0,0,0,64,48V64H48A16,16,0,0,0,32,80V208a16,16,0,0,0,16,16H176a16,16,0,0,0,16-16V192h16a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM80,48H208v69.38l-16.7-16.7a16,16,0,0,0-22.62,0L93.37,176H80Zm96,160H48V80H64v96a16,16,0,0,0,16,16h96ZM104,88a16,16,0,1,1,16,16A16,16,0,0,1,104,88Z"></path></svg>
@ -150,7 +150,7 @@
<script>
{% for message in get_flashed_messages() %}
// Show notifications on page load
addNotification('{{ message[0] }}', '{{ message[1] }}');
addNotification('{{ message[0] }}', {{ message[1] }});
{% endfor %}
</script>
{% block script %}{% endblock %}