Galleries/PythonGallery
1
0
Fork 0
mirror of https://github.com/Derpy-Leggies/OnlyLegs.git synced 2025-06-29 11:36:16 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add EXIF data displaying

Browse source 
Add info to setup and manifest(o)
Change background scroll effect
This commit is contained in:
Michał Gdula 2023-01-10 22:17:41 +00:00
parent 44a6712b6e
commit 8c25779882
10 changed files with 74 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

14
gallery/templates/image.html
View file

@ -1,7 +1,7 @@
{% extends 'layout.html' %}
{% block header %}
<img src="/uploads/original/{{ fileName }}" alt="leaves" onload="imgFade(this)" style="display: none;"/>
<img src="/uploads/original/{{ image['file_name'] }}" alt="leaves" onload="imgFade(this)" style="display: none;"/>
{% endblock %}
{% block content %}
@ -9,13 +9,19 @@
<div class="image__container">
<img
class="image__item"
src="/uploads/original/{{ fileName }}"
src="/uploads/original/{{ image['file_name'] }}"
onload="imgFade(this)" style="display:none;"
/>
</div>
<div class="image__info">
<h2>{{ fileName }}</h2>
<p>{{ id }}</p>
<h2>{{ image['file_name'] }}</h2>
<p>{{ image['id'] }}</p>
<p>{{ image['author_id'] }}</p>
</div>
<div class="image__info">
{% for tag in exif %}
<p>{{ tag }}: {{ exif[tag] }}</p>
{% endfor %}
</div>
</div>
{% endblock %}

9
gallery/templates/layout.html
View file

@ -59,15 +59,18 @@
{% block content %}
{% endblock %}
<i class="ph-arrow-circle-up" id="topButton"></i>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-2 -2 24 24" fill="currentColor" id="topButton">
<path d="M11 8.414V14a1 1 0 0 1-2 0V8.414L6.464 10.95A1 1 0 1 1 5.05 9.536l4.243-4.243a.997.997 0 0 1 1.414 0l4.243 4.243a1 1 0 1 1-1.414 1.414L11 8.414zM10 20C4.477 20 0 15.523 0 10S4.477 0 10 0s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16z"></path>
</svg>
</main>
<script>
let navToggle = true;
document.onscroll = function() {
document.querySelector('header').style.opacity = `${1 - window.scrollY / 169}`;
document.querySelector('header img').style.cssText = `object-position: center ${window.scrollY / 2}px`;
document.querySelector('header').style.opacity = `${1 - window.scrollY / 621}`;
//document.querySelector('header').style.height = `calc(50vh - ${window.scrollY / 2}px)`;
document.querySelector('header').style.top = `-${window.scrollY / 5}px`;
if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 20) {
document.querySelector('#topButton').style.opacity = 1;