WallyHackenslacker/NibasaViewer
1
0
Fork 0
Code Issues 14 Pull Requests Packages Projects 2 Releases Wiki Activity

Added search function.

Browse Source
This commit is contained in:
Wally Hackenslacker
2023-08-21 21:20:27 -04:00
parent 1a16e9f763
commit d445d633b4
7 changed files with 211 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

140
viewer/templates/gallery_view.html
View File

@@ -8,98 +8,150 @@
</title>
<link href="{% static 'css/styles.css' %}" rel="stylesheet">
</head>
<body class="background">
{% if images|length > 0 %}
<!-- Navigation bar. -->
<table class="fc mauto">
<tr>
<!-- Home button. -->
<td>
<a href="/gallery/" class="mr-2">
<img src="{% static 'imgs/gohome.png' %}" class="small-nav-icon">
</a>
</td>
<!-- Back button. -->
{% if not search %}
<td>
<a href=".." class="mr-2">
<img src="{% static 'imgs/back.png' %}" class="small-nav-icon">
</a>
</td>
{% endif %}
<!-- Directory path. -->
<td>
<h1 class="mr-2">
{{request.path}} - Files ({{num_files}})
{% if not search %}
{{request.path}} - Files: {{num_files}}
{% else %}
Search: {{search_text}} - Files: {{num_files}}
{% endif %}
</h1>
</td>
<!-- Page links. -->
{% if num_pages > 1 %}
<td>
<div class="mauto">
{% for page in pages %}<a href="./?page={{page}}">{{page}}</a>{% if not forloop.last %}<span> </span>{% endif %}{% endfor %}
{% for page in pages %}<a href="./?page={{page}}{%if search %}&{{search}}{% endif %}">{{page}}</a>{% if not forloop.last %}<span> </span>{% endif %}{% endfor %}
</div>
</td>
{% endif %}
</tr>
</table>
<div class="centered-container">
<!-- Search form. -->
{% if not search %}
<form action="{% url 'gallery_view_root' %}" method="GET">
<table class="fc mauto">
<tr>
{% if page != 1 %}
<td class="fc">
<a href="./?page={{prev_page}}">
<img src="{% static 'imgs/back.png' %}" class="navigation-icon">
</a>
<!-- Search title. -->
<td>
<h3>
Search:
</h3>
</td>
{% endif %}
<td class="fc">
<table class="mauto">
<tbody>
{% for row in images %}
<tr>
{% for cell in row %}
<td class="column">
<a href="{{cell.path}}">
<img src="{{cell.thumbnail}}">
<br>
<span>
{{cell.path|truncatechars:15}}
</span>
</a>
</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
<!-- Search bar. -->
<td>
<input type="text" name="search" class="search-box">
</td>
{% if page != num_pages %}
<td class="fc">
<a href="./?page={{next_page}}">
<img src="{% static 'imgs/forward.png' %}" class="navigation-icon">
</a>
<!-- Search submit. -->
<td>
<button type="submit" class="search-btn">
<img src="{% static 'imgs/find.png' %}" class="small-nav-icon">
</button>
</td>
{% endif %}
</tr>
</table>
</div>
</form>
{% endif %}
<!-- Images in current directory. -->
{% if images|length > 0 %}
<table class="fc mauto">
<tr>
<!-- Previous page button. -->
{% if page != 1 %}
<td class="fc">
<a href="./?page={{prev_page}}{%if search %}&{{search}}{% endif %}">
<img src="{% static 'imgs/back.png' %}" class="navigation-icon">
</a>
</td>
{% endif %}
<!-- Image rows. -->
<td class="fc">
<table class="mauto">
<tbody>
{% for row in images %}
<tr>
{% for image in row %}
<td class="column">
<a href="{{image.path}}">
<!-- Thumbnail. -->
<img src="{{image.thumbnail}}">
<br>
<!-- Image name. -->
<span>
{{image.name|truncatechars:15}}
</span>
</a>
</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
</td>
<!-- Next page button. -->
{% if page != num_pages %}
<td class="fc">
<a href="./?page={{next_page}}{%if search %}&{{search}}{% endif %}">
<img src="{% static 'imgs/forward.png' %}" class="navigation-icon">
</a>
</td>
{% endif %}
</tr>
</table>
{% endif %}
{% if subdirs|length > 0 %}
<!-- Sub-directories title. -->
<div class="centered-container">
<h1>
Sub-directories
</h1>
</div>
<!-- Sub-directory rows. -->
<div class="centered-container">
<table class="mauto">
<tbody>
{% for row in subdirs %}
<tr>
{% for cell in row %}
{% for subdir in row %}
<td class="column">
{% if request.path == '/gallery/' %}
<a href="{{cell.name}}">
{% else %}
<a href="{{request.path}}{{cell.name}}">
{% endif %}
<a href="{{subdir.path}}">
<img src="{% static 'imgs/folder-pictures.png' %}">
<br>
<span>
{{cell.name}}
{{subdir.name}}
</span>
</a>
</td>