Commit 65366e8f by gijs

Merge branch 'layout-proposals' into linked-axes

parents a689dfd5 42d00615
......@@ -81,4 +81,4 @@ class ScoreLightSerializer(serializers.HyperlinkedModelSerializer):
class Meta:
model = Score
fields = ('id', 'title', 'tags', 'created_at', 'updated_at')
fields = ('id', 'title', 'tags', 'language', 'created_at', 'updated_at')
......@@ -350,19 +350,33 @@ section.hidden { display: none; }
.btn-hamburger {
position: absolute;
color: grey;
font-family: Sans-Serif;
font-size: 16px;
font-weight: bold;
top: 10px;
bottom: 100%;
}
.btn-hamburger--right {
right: 10px;
left: 100%;
transform-origin: bottom left;
transform: rotate(90deg);
}
.btn-hamburger--left {
left: 10px;
right: 100%;
transform-origin: bottom right;
transform: rotate(-90deg);
}
.btn-hamburger__inner {
display: block;
padding-right: 30px;
}
.btn-hamburger--right .btn-hamburger__inner {
transform: rotate(180deg);
padding-top: 10px;
}
.btn-hamburger--left .btn-hamburger__inner {
padding-bottom: 10px;
}
.linked-node .axis-title-edit:before {
......@@ -380,15 +394,16 @@ section.hidden { display: none; }
.btn-hamburger:hover {
cursor: pointer;
color: black;
color: #173a42;
filter: brightness(200%);
}
.main-header.is-collapsed .btn-hamburger {
right: -26px;
/* right: -26px; */
}
#help.is-collapsed .btn-hamburger {
left: -26px;
/* left: -26px; */
}
.logo { margin: 21px 0 42px 0; }
......@@ -414,7 +429,7 @@ section.hidden { display: none; }
.main-area {
overflow: auto;
margin-left: 0;
padding: 30px 30px;
padding: 30px 60px;
transition: all .2s;
flex: 1;
}
......@@ -1222,3 +1237,58 @@ li .icon--tag { color: white } */
color: #173a42;
filter: brightness(200%);
}
.btn-filter {
font-family: 'GothicA1', sans-serif;
line-height: 21px;
font-weight: 500;
}
.btn-filter {
color: var(--text-color);
border: none;
padding: .3em 1em .2em 1em;
background: transparent;
margin-top: .15em;
}
.btn-filter { background: var(--background-color-button); }
.filters {
/* display: flex; */
}
.filters__filter + .filters__filter {
margin-top: 1em;
}
/* .filters__filter li:nth-of-type(n+3){ */
/* display: none */
/* } */
/* .filters__filter:hover li:nth-of-type(n+3){ */
/* display: list-item; */
/* } */
/* .filters__filter:hover ol:after { */
/* content: "" */
/* } */
/* .filters__filter ol:after { */
/* content: "..." */
/* } */
.filters__filter li {
cursor: pointer;
}
.filters__filter li:hover {
color: var(--button-color-disabled);
}
/* #tag-filter li { display: inline; text-overflow: ellipsis } */
......@@ -69,6 +69,11 @@ window.W = window.W || {};
cell: MyDatetimeCell
},
{
name: "language",
label: "Language",
cell: "string",
},
{
name: "tags",
label: "Tags",
cell: "string",
......@@ -2012,25 +2017,15 @@ window.W = window.W || {};
options.syncWith.listenTo(this, 'filter', function(view, event, options) {
console.log(view);
this.queryParams[that.collection.action] = $(event.currentTarget).data("value");
this.fetch()
});
},
});
W.FilterView = Backbone.Marionette.View.extend({
template: '#filters-template',
var action = this.queryParams[that.collection.action];
triggers: {
'click a': 'filter',
},
onFilter: function (view, event) {
console.log(event);
this.collection.queryParams.score_type = $(event.currentTarget).data('value');
// this.collection.queryParams.score_type = e.val();
this.collection.fetch();
if (action && action == "tags") {
this.queryParams[that.collection.action] += "," + $(event.currentTarget).data("value");
} else {
this.queryParams[that.collection.action] = $(event.currentTarget).data("value");
}
this.getFirstPage();
});
},
});
......@@ -2043,7 +2038,6 @@ window.W = window.W || {};
'submit .create-form': 'create'
},
onCreate: function (event) {
var title = this.$el.find('[name="title"]').val();
var myModel = new W.ScoreModel();
......@@ -2060,6 +2054,40 @@ window.W = window.W || {};
});
W.AppliedFiltersView = Backbone.Marionette.View.extend({
template: '#applied-filters-template',
templateContext: function() {
console.log(this.collection.queryParams);
return {
search: this.collection.queryParams.search,
tags: this.collection.queryParams.tags,
score_type: this.collection.queryParams.score_type,
language: this.collection.queryParams.language
}
},
triggers: {
'click span': 'remove'
},
onRemove: function(view, event) {
console.log($(event.currentTarget).data("filter"));
console.log($(event.currentTarget).data("value"));
console.log(view.collection.queryParams);
var filter = $(event.currentTarget).data("filter");
delete this.collection.queryParams[filter];
this.collection.getFirstPage();
},
initialize: function () {
this.listenTo(this.collection, 'sync', this.render);
}
});
W.ScoreListView = Backbone.Marionette.View.extend({
template: '#score-list-template',
......@@ -2072,6 +2100,7 @@ window.W = window.W || {};
languageFilter: '#language-filter',
scoreTypeFilter: '#score-type-filter',
tagFilter: '#tag-filter',
appliedFilters: '#applied-filters',
},
onRender: function () {
......@@ -2094,24 +2123,15 @@ window.W = window.W || {};
collection: scoreCollection
});
var myFilterView = new W.FilterView({
var mySearchView = new W.SearchView({
collection: scoreCollection
});
// ServerSideFilter delegates the searching to the server by submitting a query.
// var serverSideFilter = new Backgrid.Extension.ServerSideFilter({
// collection: scoreCollection,
// // the name of the URL query parameter
// name: "score_type",
// placeholder: "ex: location:your country" // HTML5 placeholder for the search box
// });
// $("body").before(serverSideFilter.render().el);
var mySearchView = new W.SearchView({
var myAppliedFiltersView = new W.AppliedFiltersView({
collection: scoreCollection
});
var myPaginationView = new Backgrid.Extension.Paginator({
controls : {
rewind: {
......@@ -2166,6 +2186,7 @@ window.W = window.W || {};
that.showChildView('scoreTypeFilter', scoreTypeChoiceListView);
that.showChildView('tagFilter', TagChoiceListView);
that.showChildView('list', myListView);
that.showChildView('appliedFilters', myAppliedFiltersView);
that.showChildView('pagination', myPaginationView);
}
});
......
......@@ -19,6 +19,10 @@
{% include "playground/underscore/about.mtpl" %}
</script>
<script id="applied-filters-template" type="text/template">
{% include "playground/underscore/applied-filters.mtpl" %}
</script>
<script id="attachment-template" type="text/template">
{% include "playground/underscore/attachment.mtpl" %}
</script>
......
<% if (search) { %>
Résultats pour: <%- search %>
<% } %>
<% if (language) { %>
<span class="btn-filter" data-filter="language" data-value="<%- language %>"><span class="btn-filter__label"><%- ('langue') %></span>:<%- language %> [x]</span>
<% } %>
<% if (score_type) { %>
<span class="btn-filter" data-filter="score_type" data-value="<%- score_type %>"><span class="btn-filter__label"><%- ('type de partition') %></span>:
<% if (score_type === 1) { %>
<%- t('Transcription') %>
<% } else if (score_type === 2) { %>
<%- t('Prescription') %>
<% } else if (score_type === 3) { %>
<%- t('Traduction') %>
<% } %>
[x]
</span>
<% } %>
<% if (tags) { %>
<span class="btn-filter" data-filter="tags" data-value="<%- tags %>"><span class="btn-filter__label"><%- ('tags') %></span>:<%- tags %> [x]</span>
<% } %>
<div class="btn-hamburger btn-hamburger--right js-collapse">menu</div>
<div class="btn-hamburger btn-hamburger--right js-collapse"><span class="btn-hamburger__inner">menu</span></div>
<div class="content">
<nav>
......@@ -12,7 +12,7 @@
<% } else { %>
<li><a href="#" class="btn-login"><%- t('se connecter') %></a> <a href="#" class="btn-register"><%- t('s\'inscrire') %></a></li>
<% } %>
<li><a href="#" class="btn-lang" data-lang="en">en</a> <a href="#" class="btn-lang" data-lang="fr">fr</a></li>
<!-- <li><a href="#" class="btn-lang" data-lang="en">en</a> <a href="#" class="btn-lang" data-lang="fr">fr</a></li> -->
</ul>
</nav>
......
<div class="btn-hamburger btn-hamburger--left js-collapse">aide</div>
<div class="btn-hamburger btn-hamburger--left js-collapse"><span class="btn-hamburger__inner">aide</span></div>
<iframe class="help__frame" src="/pages/home/"></iframe>
<div>
<h1><%- t('Partitions existantes') %></h1>
<div id="search"></div>
<div>
<div class="filters">
<div class="filters__filter">
<p><%- t('langue') %></p>
<div id="language-filter"></div>
</div>
<br>
<p>languages</p>
<div id="language-filter"></div>
<div class="filters__filter">
<p><%- t('type de partition') %></p>
<div id="score-type-filter"></div>
</div>
<br>
<p>score types</p>
<div id="score-type-filter"></div>
<div class="filters__filter">
<p><%- t('tags') %></p>
<div id="tag-filter"></div>
</div>
</div>
<br>
<p>tags</p>
<div id="tag-filter"></div>
</div>
<br>
<div id="list"></div>
<div id="pagination"></div>
<div>
<h1><%- t('Partitions existantes') %></h1>
<div id="applied-filters"></div>
<div id="search"></div>
<div id="list"></div>
<div id="pagination"></div>
</div>
</div>
......@@ -5,6 +5,7 @@ from rest_framework.parsers import FormParser, MultiPartParser, JSONParser
from rest_framework.filters import OrderingFilter, SearchFilter, DjangoObjectPermissionsFilter
from rest_framework.decorators import action
from django_filters import BooleanFilter
from django_filters import rest_framework as filters
from django_filters.rest_framework import DjangoFilterBackend, FilterSet
from .models import Attachment, Score, FeaturedScore
from .serializers import AttachmentSerializer, ScoreSerializer, ScoreLightSerializer, UserSerializer
......@@ -15,6 +16,8 @@ from rest_framework.response import Response
from collections import OrderedDict
from django.db import models
from playground.models import Score
from taggit.models import Tag
......@@ -38,8 +41,6 @@ class ScoreViewSetPagination(PageNumberPagination):
page_size_query_param = 'page_size'
from django_filters import rest_framework as filters
class TagsFilter(filters.CharFilter):
def filter(self, qs, value):
if value:
......@@ -116,26 +117,28 @@ class ScoreViewSet(viewsets.ModelViewSet):
@action(detail=False)
def score_type(self, request):
Score.SCORE_TYPE_CHOICES
data = self.filter_queryset(self.queryset).order_by("score_type").values("score_type").annotate(n=models.Count("pk"))
data = self.filter_queryset(self.queryset).order_by("score_type").values("score_type").annotate(n=models.Count("pk")).order_by('-n')
data = [{'value': i['score_type'], 'label': dict(Score.SCORE_TYPE_CHOICES).get(i['score_type']), 'n': i['n']} for i in data]
return Response(data)
@action(detail=False)
def genres(self, request):
data = self.filter_queryset(self.queryset).order_by("genre").values("genre").annotate(n=models.Count("pk"))
data = self.filter_queryset(self.queryset).order_by("genre").values("genre").annotate(n=models.Count("pk")).order_by('-n')
data = [{'value': i['genre'], 'label': i['genre'], 'n': i['n']} for i in data]
return Response(data)
@action(detail=False)
def tags(self, request):
data = self.filter_queryset(self.queryset).order_by("tags").values("tags__name").annotate(n=models.Count("pk"))
data = [{'value': i['tags__name'], 'label': i['tags__name'], 'n': i['n']} for i in data]
ids = self.filter_queryset(self.queryset).order_by("tags").values_list("id", flat=True)
data = Tag.objects.filter(score__id__in=ids).values("name").annotate(n=models.Count("score__pk")).order_by('-n')
data = [{'value': i['name'], 'label': i['name'], 'n': i['n']} for i in data]
return Response(data)
@action(detail=False)
def language(self, request):
data = self.filter_queryset(self.queryset).order_by("language").values("language").annotate(n=models.Count("pk"))
data = [{'value': i['language'], 'label': i['language'], 'n': i['n']} for i in data]
data = self.filter_queryset(self.queryset).order_by("language").values("language").annotate(n=models.Count("pk")).order_by('-n')
data = [{'value': i['language'], 'label': i['language'], 'n': i['n']} for i in data if i['language']]
return Response(data)
def get_queryset(self):
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment