$(".is-active", $(this).parent()).removeClass("is-active");
$(this).addClass("is-active");
let prop = $(this).attr('data-order');
+ $(".l-books__sorting select").val(prop);
+ if (prop == '-') prop = '';
+ resort(prop);
+ });
+ $(".l-books__sorting select").on('change', function() {
+ let prop = $(this).val();
+ $(".is-active", $(this).parent()).removeClass("is-active");
+ $("[data-order='" + prop +"']", $(this).parent()).addClass("is-active");
+ if (prop == '-') prop = '';
+ resort(prop);
+ });
-
+ function resort(prop) {
// do we NOW have pages (possibly after filtering)?
// if we don't have pages, we can just sort here.
let havePages = $('.l-pagination li').length > 0;
}, 200);
}
}, 200);
- });
+ }
})(jQuery);
<div>
{% if tag.photo %}
<figure class="l-author__photo">
- <img src="{{ tag.photo.url }}" alt="{{ tag.name }}" style="width: 238px;">
+ <img src="{{ tag.photo.url }}" alt="{{ tag.name }}">
<figcaption>
{{ tag.photo_attribution|safe }}
</figcaption>
</div>
</div>
</div>
- <div class="l-author with-filter">
+ <div class="with-filter">
<div class="row">
<h2>{% nice_title_from_tags tags categories %}</h2>
<div>
{% for ordering in view.get_orderings %}
<button
- {% if not ordering.default %}
+ {% if ordering.default %}
+ data-order="-"
+ {% else %}
data-order="{{ ordering.slug }}"
{% endif %}
{% if ordering.active %}
{% endif %}
>{{ ordering.name }}</button>
{% endfor %}
+ <select name="sorting">
+ {% for ordering in view.get_orderings %}
+ <option
+ {% if ordering.default %}
+ value="-"
+ {% else %}
+ value="{{ ordering.slug }}"
+ {% endif %}
+ {% if ordering.active %}
+ selected="selected"
+ {% endif %}
+ >{{ ordering.name }}</option>
+ {% endfor %}
+ </select>
</div>
</div>
{% endif %}
</div>
</div>
- <div class="l-author with-filter">
+ <div class="l-section">
+ <div class="with-filter">
<div class="row">
- <h2>{% nice_title_from_tags tags suggested_tags_by_category %}</h2>
+ <h2 class="header">{% nice_title_from_tags tags suggested_tags_by_category %}</h2>
{% if suggested_tags %}
<div class="filter-container">
{% for tag in suggested_tags %}
{% endif %}
</div>
</div>
+ </div>
{% autopaginate object_list view.page_size %}
</div>
</div>
</div>
- <div class="l-author with-filter">
+ <div class="with-filter">
<div class="row">
<h2>{% nice_title_from_tags tags categories %}</h2>
{% if suggest %}
</div>
</div>
</div>
- <div class="l-author with-filter">
+ <div class="with-filter">
<div class="row">
- <h2>{% nice_title_from_tags tags categories %}</h2>
+ <h2 class="header">{% nice_title_from_tags tags categories %}</h2>
{% if suggest %}
<div class="filter-container">
{% for tag in suggest %}
-{% extends "base/base.html" %}
+{% extends request.EXPERIMENTS.layout.value|yesno:"2022/base_simple.html,base/base.html" %}
{% load i18n %}
{% load catalogue_tags %}
<h1>{% title_from_tags tags %}</h1>
<p>{% trans "The criteria are ambiguous. Please select one of the following options:" %}</p>
- <div id="books-list">
- {% for option in options %}
- <div class="book-description">
- <p><a href="{% url 'tagged_object_list' option.url_args %}">{% if tags %}{% title_from_tags tags %}, {% endif %}<em>{%title_from_tags option.tags %}</em>{% if unparsed %}, {{unparsed|join:', '}}{% endif %}</a></p>
+ <div id="books-list">
+ {% for option in options %}
+ <div class="book-description">
+ <p><a href="{% url 'tagged_object_list' option.url_args %}">{% if tags %}{% title_from_tags tags %}, {% endif %}<em>{%title_from_tags option.tags %}</em>{% if unparsed %}, {{unparsed|join:', '}}{% endif %}</a></p>
</div>
{% endfor %}
</div>
path('rodzaj/', views.tag_catalogue, {'category': 'kind'}, name='kind_catalogue'),
path('motyw/', views.tag_catalogue, {'category': 'theme'}, name='theme_catalogue'),
- path('galeria/', views.GalleryView.as_view(), name='gallery'),
+ path('galeria/', views.gallery, name='gallery'),
path('kolekcje/', views.collections, name='catalogue_collections'),
- path('lektury/', views.LiteratureView.as_view(), name='book_list'),
+ path('lektury/', views.literature, name='book_list'),
path('lektury/<slug:slug>/', views.collection, name='collection'),
- path('audiobooki/', views.AudiobooksView.as_view(), name='audiobook_list'),
+ path('audiobooki/', views.audiobooks, name='audiobook_list'),
path('daisy/', views.daisy_list, name='daisy_list'),
path('jtags/', search.views.hint, {'param': 'q', 'mozhint': True}, name='jhint'),
path('nowe/', ListView.as_view(
name='tagged_object_list_gallery'),
re_path(r'^audiobooki/(?P<tags>[a-zA-Z0-9-/]*)/$', views.tagged_object_list, {'list_type': 'audiobooks'},
name='tagged_object_list_audiobooks'),
- re_path(r'^(?P<tags>[a-zA-Z0-9-/]*)/$', views.TaggedObjectList.as_view(),
+ re_path(r'^(?P<tags>[a-zA-Z0-9-/]*)/$', views.tagged_object_list, {'list_type': 'books'},
name='tagged_object_list'),
]
orderings = {}
default_ordering = None
- def setup(self, request, **kwargs):
- super().setup(request, **kwargs)
+ def analyse(self):
self.is_themed = False
self.ctx = ctx = {}
ctx['tags'] = []
+ def dispatch(self, *args, **kwargs):
+ try:
+ self.analyse()
+ except ResponseInstead as e:
+ return e.response
+ return super().dispatch(*args, **kwargs)
+
def get_orderings(self):
order = self.get_order()
return [
class AudiobooksView(LiteratureView):
title = gettext_lazy('Audiobooks')
+ list_type = 'audiobooks'
def get_queryset(self):
return Book.objects.filter(findable=True, media__type='mp3').distinct()
class TaggedObjectList(BookList):
- def setup(self, request, tags, **kwargs):
- super().setup(request, **kwargs)
- self.ctx['tags'] = analyse_tags(request, tags)
+ def analyse(self):
+ super().analyse()
+ self.ctx['tags'] = analyse_tags(self.request, self.kwargs['tags'])
self.ctx['fragment_tags'] = [t for t in self.ctx['tags'] if t.category in ('theme', 'object')]
self.ctx['work_tags'] = [t for t in self.ctx['tags'] if t not in self.ctx['fragment_tags']]
self.is_themed = self.ctx['has_theme'] = bool(self.ctx['fragment_tags'])
def literature(request):
+ if request.EXPERIMENTS['layout'].value:
+ return LiteratureView.as_view()(request)
books = Book.objects.filter(parent=None, findable=True)
return object_list(request, books, related_tags=get_top_level_related_tags([]))
def gallery(request):
+ if request.EXPERIMENTS['layout'].value:
+ return GalleryView.as_view()(request)
return object_list(request, Picture.objects.all(), list_type='gallery')
def audiobooks(request):
+ if request.EXPERIMENTS['layout'].value:
+ return AudiobooksView.as_view()(request)
audiobooks = Book.objects.filter(findable=True, media__type__in=('mp3', 'ogg')).distinct()
return object_list(request, audiobooks, list_type='audiobooks', extra={
'daisy': Book.objects.filter(findable=True, media__type='daisy').distinct(),
def tagged_object_list(request, tags, list_type):
+ if request.EXPERIMENTS['layout'].value and list_type in ('books', 'audiobooks'):
+ return TaggedObjectList.as_view()(request, tags=tags)
+
try:
tags = analyse_tags(request, tags)
except ResponseInstead as e:
</div>
</div>
- <div class="l-author with-filter">
+ <div class="with-filter">
<div class="row">
- <h2> </h2>
+ <h2 class="header"> </h2>
{% if suggest %}
<div class="filter-container">
{% with list_type='book' %}
overflow-y: hidden;
}
-.l-navigation__logo {
- height: 44px;
-}
-
.l-navigation__menu {
.scrollable {
height: 100%;
display: flex;
padding: 50px 0;
justify-content: space-between;
+ flex-direction: column;
+ align-items: center;
+
+ @include rwd($break-flow) {
+ flex-direction: row;
+ align-items: flex-start;
+ }
h2 {
margin: 0;
width: 100%;
&:nth-child(1) {
-
div {
- display: flex;
+ display: flex;
+ flex-wrap: wrap;
+
+ @include rwd($break-wide) {
+ flex-wrap: nowrap;
+ }
}
h2 {
}
.l-author__photo {
- width: 100%;
- max-width: 238px;
+ width: calc(50% - 24px);
+ @include rwd($break-wide) {
+ width: 238px;
+ }
+
+ img {
+ width:100%;
+ }
}
}
&:nth-child(2) {
- max-width: 415px;
- padding-top: 48px;
- padding-left: 32px;
+ max-width: 415px - 32px;
+ padding-top: 48px;
+ @include rwd($break-flow) {
+ max-width: 415px;
+ padding-left: 32px;
+ }
}
}
}
.l-author__info {
- min-width: 364px;
+ display: contents;
+ min-width: 364px;
+ @include rwd($break-wide) {
+ display: block;
+ }
h3 {
margin: 0;
line-height: 140%;
letter-spacing: -0.01em;
color: #007880;
+
+ width: 40%;
}
p {
margin-top: 20px;
}
.l-author__photo {
- margin: 0;
- margin-right: 50px;
+ margin: 0;
+ margin-right: 16px;
+ @include rwd($break-wide) {
+ margin-right: 50px;
+ }
img {
border-radius: 10px;
overflow: hidden;
.l-books__header {
width: 100%;
display: flex;
+ gap: 16px;
+ flex-direction: column;
margin-top: 34px;
align-items: center;
justify-content: space-between;
+ align-items: stretch;
+
+ @include rwd($break-flow) {
+ flex-direction: row;
+ }
}
.l-books__input {
position: relative;
display: flex;
align-content: center;
- width: 560px;
+ @include rwd($break-flow) {
+ width: 560px;
+ }
.icon {
@include font-size(22px);
border-radius: 52px;
border: 1px solid #D9D9D9;
width: 100%;
- max-width: 580px;
outline: 0;
transition: border $ease-out 350ms;
+ @input rwd($break-flow) {
+ max-width: 580px;
+ }
+
&:focus {
border-color: #007880;
}
.l-books__sorting {
display: flex;
align-content: center;
+ align-items: center;
+ justify-content: center;
span {
font-weight: $bold;
div {
display: flex;
align-content: center;
+ flex-direction: column;
+ @include rwd($break-flow) {
+ flex-direction: row;
+ }
+
+ select {
+ margin-left: 30px;
+ @include rwd($break-flow) {
+ display: none;
+ }
+ }
+
button {
+ display: none;
border: 0;
padding: 0;
margin: 0 0 0 30px;
color: #808080;
cursor: pointer;
+ @include rwd($break-flow) {
+ display: block;
+ }
+
&.is-active {
color: #083F4D;
font-weight: $semibold;
.l-navigation__logo {
display: flex;
position: relative;
+ height: 44px;
+ width: 153px;
+ flex-shrink: 0;
+ overflow: hidden;
+ transition: .5s width;
+ @include rwd($break-menu) {
+ width: 230px;
+ }
+
+ &.search-active {
+ width: 30px;
+ @include rwd($break-menu) {
+ width: 230px;
+ }
+ }
+
img {
width: 153px;
@include rwd($break-menu) {
max-width: 580px;
margin-left: 20px;
margin-right: 20px;
+ flex-grow: 1;
@include rwd($break-menu) {
margin-left: 60px;
.with-filter {
padding: 20px 0 0;
position: relative;
+ width: 100%;
h2 {
margin-bottom: 0;
$(function() {
$("#search").search();
+ $("#search").on('focus', function() {
+ $(".l-navigation__logo").addClass('search-active');
+ });
+ $("#search").on('blur', function() {
+ $(".l-navigation__logo").removeClass('search-active');
+ });
});
})(jQuery);
};
this.element.autocomplete($.extend(opts, this.options));
- this.element.autocomplete('instance')._renderItem = __bind(this, this.render_item_2022);
- this.element.data('autocomplete')._renderItem = __bind(this, this.render_item);;
+ if (this.element.autocomplete('instance') !== undefined) this.element.autocomplete('instance')._renderItem = __bind(this, this.render_item_2022);
+ if (this.element.data('autocomplete') !== undefined) this.element.data('autocomplete')._renderItem = __bind(this, this.render_item);;
},
enter: function(event, ui) {