diff --git a/viewer/static/css/styles.css b/viewer/static/css/styles.css index 1d4a007..330ec68 100644 --- a/viewer/static/css/styles.css +++ b/viewer/static/css/styles.css @@ -28,6 +28,14 @@ margin: auto; } +.navigation-icon { + width: 100px; +} + +.mb-2 { + margin-bottom: 2em; +} + /**************************************************************************** * Grid. * ****************************************************************************/ diff --git a/viewer/templates/gallery_view.html b/viewer/templates/gallery_view.html index 4c59dc0..e8902b8 100644 --- a/viewer/templates/gallery_view.html +++ b/viewer/templates/gallery_view.html @@ -9,21 +9,17 @@ -
- - - - - - -
+ {% include 'partials/navigation.html'%} {% if images|length > 0 %}

- Files + Files ({{num_files}})

+
+ {% for page in pages %}{{page}}{% if not forloop.last %} {% endif %}{% endfor %} +
{% for row in images %} diff --git a/viewer/templates/image_view.html b/viewer/templates/image_view.html index f5c3db6..f691054 100644 --- a/viewer/templates/image_view.html +++ b/viewer/templates/image_view.html @@ -4,19 +4,12 @@ - Vieweing file: {{image_path}} + File: {{image_path.name}} -
- - - - - - -
+ {% include 'partials/navigation.html'%}
diff --git a/viewer/templates/partials/navigation.html b/viewer/templates/partials/navigation.html new file mode 100644 index 0000000..7108e5a --- /dev/null +++ b/viewer/templates/partials/navigation.html @@ -0,0 +1,9 @@ +{% load static %} +
+ + + + + + +
diff --git a/viewer/views.py b/viewer/views.py index fe65955..d7a12a3 100644 --- a/viewer/views.py +++ b/viewer/views.py @@ -1,5 +1,6 @@ # Standard library imports. from pathlib import Path +from math import ceil # External library imports. import filetype @@ -13,6 +14,14 @@ from django.shortcuts import (render, # Project imports. from .utils import make_thumbnail +########################################################################################### +# CONSTANTS. # +########################################################################################### + +CELLS_PER_ROW = 7 +ROWS_PER_PAGE = 4 +IMAGES_PER_PAGE = CELLS_PER_ROW * ROWS_PER_PAGE + ########################################################################################### # View functions. # ########################################################################################### @@ -23,7 +32,7 @@ def gallery_view(request, path = None): The path should be inside the GALLERY_ROOT path, otherwise a 404 error will be thrown. """ - def list2rows(lst, cells = 7): + def list2rows(lst, cells = CELLS_PER_ROW): rows = [] i = 0 while i < len(lst): @@ -45,7 +54,14 @@ def gallery_view(request, path = None): images = sorted([i for i in full_path.iterdir() if i.is_file() and filetype.is_image(str(i))]) img_data = [] - for image in images: + try: + page = int(request.GET.get('page', 1)) - 1 + except ValueError: + page = 0 + + page_base = IMAGES_PER_PAGE * page + + for image in images[page_base : page_base + IMAGES_PER_PAGE]: make_thumbnail(image) img_context = { @@ -57,9 +73,11 @@ def gallery_view(request, path = None): img_data.append(img_context) context = { - 'path': path, - 'subdirs': list2rows(subdirs), - 'images': list2rows(img_data) + 'path': path, + 'subdirs': list2rows(subdirs), + 'images': list2rows(img_data), + 'pages': range(1, ceil((len(images) / CELLS_PER_ROW) / ROWS_PER_PAGE) + 1), + 'num_files': len(images) } return render(request, 'gallery_view.html', context)