collection use htmx

This commit is contained in:
Your Name 2021-12-27 08:26:07 -05:00
parent 84359ec4fa
commit 447922a336
4 changed files with 116 additions and 83 deletions

View file

@ -13,11 +13,12 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:title" content="{{ site_name }} {% trans '收藏單' %} - {{ collection.title }}">
<meta property="og:title" content="{{ site_name }} {% trans '收藏单' %} - {{ collection.title }}">
<meta property="og:description" content="{{ collection.description }}">
<meta property="og:type" content="article">
<meta property="og:article:author" content="{{ collection.owner.username }}">
<meta property="og:url" content="{{ request.build_absolute_uri }}">
<meta property="og:image" content="{{ request.scheme }}://{{ request.get_host }}{% static 'img/logo_square.svg' %}">
<meta property="og:image" content="{{ collection.cover|thumb:'normal' }}">
<title>{{ site_name }} {% trans '收藏单' %} - {{ collection.title }}</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="{% static 'lib/js/rating-star.js' %}"></script>
@ -63,92 +64,25 @@
</div>
</div>
<!-- <div class="dividing-line"></div> -->
<!-- <div class="entity-card__img-wrapper" style="text-align: center;">
<img src="{{ collection.cover|thumb:'normal' }}" alt="" class="entity-card__img">
</div> -->
<div id="rawContent">
{{ form.description }}
</div>
{{ form.media }}
</div>
<div class="entity-list">
<ul class="entity-list__entities">
{% for item in collection.collectionitem_list %}
{% if item.item is not None %}
<li class="entity-list__entity">
<div class="entity-list__entity-img-wrapper">
<a href="{{ item.item.get_absolute_url }}">
<img src="{{ item.item.cover|thumb:'normal' }}" alt="" class="entity-list__entity-img">
</a>
</div>
<div class="entity-list__entity-text">
{% if editable %}
<div style="float:right">
{% if not forloop.first %}
<a hx-post="{% url 'collection:move_up_item' form.instance.id item.id %}"></a>
{% endif %}
{% if not forloop.last %}
<a hx-post="{% url 'collection:move_down_item' form.instance.id item.id %}"></a>
{% endif %}
<a hx-post="{% url 'collection:delete_item' form.instance.id item.id %}"></a>
</div>
{% endif %}
<div class="entity-list__entity-title">
<a href="{{ item.item.get_absolute_url }}">{{ item.item.title }}</a>
<a href="{{ item.item.source_url }}">
<span class="source-label source-label__{{ item.item.source_site }}">{{ item.item.get_source_site_display }}</span>
</a>
</div>
<span class="entity-list__entity-info entity-list__entity-info--full-length">
<p class="entity-list__entity-brief">
{{ item.item.brief }}
</p>
</span>
<div class="tag-collection">
{% for tag_dict in item.item.tag_list %}
{% for k, v in tag_dict.items %}
{% if k == 'content' %}
<span class="tag-collection__tag">
<a href="{% url 'common:search' %}?tag={{ v }}">{{ v }}</a>
</span>
{% endif %}
{% endfor %}
{% endfor %}
</div>
<div class="clearfix"></div>
<div class="dividing-line dividing-line--dashed"></div>
<div class="entity-marks" style="margin-bottom: 0;">
<ul class="entity-marks__mark-list">
<li class="entity-marks__mark">
<p class="entity-marks__mark-content">{{ item.comment }}</p>
</li>
</ul>
</div>
</div>
</li>
{% endif %}
{% empty %}
{% endfor %}
{% if editable %}
<li>
<form action="{% url 'collection:append_item' form.instance.id %}" method="POST">
{% csrf_token %}
<input type="url" name="url" placeholder="https://neodb.social/movies/1/" style="min-width:24rem" required>
<input type="text" name="comment" placeholder="{% trans '备注' %}" style="min-width:24rem">
<input class="button" type="submit" value="{% trans '添加' %}">
</form>
</li>
{% endif %}
</ul>
<div class="entity-list" hx-get="{% url 'collection:retrieve_entity_list' collection.id %}" hx-trigger="load">
</div>
</div>
</div>
<div class="grid__aside" id="aside">
<div class="aside-section-wrapper">
<div class="entity-card">
<div class="entity-card__img-wrapper">
<a href="{% url 'collection:retrieve' collection.id %}"><img src="{{ collection.cover|thumb:'normal' }}" alt=""
class="entity-card__img"></a>
<a href="{% url 'collection:retrieve' collection.id %}">
<img src="{{ collection.cover|thumb:'normal' }}" alt="" class="entity-card__img">
</a>
</div>
<div class="entity-card__info-wrapper">
<h5 class="entity-card__title">
@ -156,9 +90,7 @@
{{ collection.title }}
</a>
</h5>
</div>
</div>
</div>
</div>

View file

@ -0,0 +1,71 @@
{% load thumb %}
{% load i18n %}
{% load l10n %}
<ul class="entity-list__entities">
{% for item in collection.collectionitem_list %}
{% if item.item is not None %}
<li class="entity-list__entity">
<div class="entity-list__entity-img-wrapper">
<a href="{{ item.item.get_absolute_url }}">
<img src="{{ item.item.cover|thumb:'normal' }}" alt="" class="entity-list__entity-img">
</a>
</div>
<div class="entity-list__entity-text">
{% if editable %}
<div style="float:right">
{% if not forloop.first %}
<a hx-target=".entity-list" hx-post="{% url 'collection:move_up_item' form.instance.id item.id %}"></a>
{% endif %}
{% if not forloop.last %}
<a hx-target=".entity-list" hx-post="{% url 'collection:move_down_item' form.instance.id item.id %}"></a>
{% endif %}
<a hx-target=".entity-list" hx-post="{% url 'collection:delete_item' form.instance.id item.id %}"></a>
</div>
{% endif %}
<div class="entity-list__entity-title">
<a href="{{ item.item.get_absolute_url }}" style="font-size:16px">{{ item.item.title }}</a>
<a href="{{ item.item.source_url }}">
<span class="source-label source-label__{{ item.item.source_site }}">{{ item.item.get_source_site_display }}</span>
</a>
</div>
<span class="entity-list__entity-info entity-list__entity-info--full-length">
<p class="entity-list__entity-brief" style="white-space: normal;">
{{ item.item.brief }}
</p>
</span>
<div class="tag-collection">
{% for tag_dict in item.item.tag_list %}
{% for k, v in tag_dict.items %}
{% if k == 'content' %}
<span class="tag-collection__tag">
<a href="{% url 'common:search' %}?tag={{ v }}">{{ v }}</a>
</span>
{% endif %}
{% endfor %}
{% endfor %}
</div>
<div class="clearfix"></div>
<div class="dividing-line dividing-line--dashed"></div>
<div class="entity-marks" style="margin-bottom: 0;">
<ul class="entity-marks__mark-list">
<li class="entity-marks__mark">
<p class="entity-marks__mark-content">{{ item.comment }}</p>
</li>
</ul>
</div>
</div>
</li>
{% endif %}
{% empty %}
{% endfor %}
{% if editable %}
<li>
<form hx-target=".entity-list" hx-post="{% url 'collection:append_item' form.instance.id %}" method="POST">
{% csrf_token %}
<input type="url" name="url" placeholder="https://neodb.social/movies/1/" style="min-width:24rem" required>
<input type="text" name="comment" placeholder="{% trans '备注' %}" style="min-width:24rem">
<input class="button" type="submit" value="{% trans '添加' %}" >
</form>
</li>
{% endif %}
</ul>

View file

@ -7,6 +7,7 @@ urlpatterns = [
path('mine/', list, name='list'),
path('create/', create, name='create'),
path('<int:id>/', retrieve, name='retrieve'),
path('<int:id>/entity_list', retrieve_entity_list, name='retrieve_entity_list'),
path('update/<int:id>/', update, name='update'),
path('delete/<int:id>/', delete, name='delete'),
path('follow/<int:id>/', follow, name='follow'),

View file

@ -173,6 +173,31 @@ def retrieve(request, id):
return HttpResponseBadRequest()
@mastodon_request_included
# @login_required
def retrieve_entity_list(request, id):
collection = get_object_or_404(Collection, pk=id)
if not collection.is_visible_to(request.user):
raise PermissionDenied()
form = CollectionForm(instance=collection)
followers = []
if request.user.is_authenticated:
followers = []
return render(
request,
'entity_list.html',
{
'collection': collection,
'form': form,
'editable': collection.is_editable_by(request.user),
'followers': followers,
}
)
@permission_required("collections.delete_collection")
@login_required
def delete(request, id):
@ -226,7 +251,7 @@ def list(request, user_id=None):
def get_entity_by_url(url):
m = re.findall(r'^/?(movies|books|games|music/album|music/song)/(\d+)/?', url.lower().replace(settings.APP_WEBSITE.lower(), ''))
m = re.findall(r'^/?(movies|books|games|music/album|music/song)/(\d+)/?', url.strip().lower().replace(settings.APP_WEBSITE.lower(), ''))
if len(m) > 0:
mapping = {
'movies': Movie,
@ -251,7 +276,8 @@ def append_item(request, id):
item = get_entity_by_url(url)
collection.append_item(item, comment)
collection.save()
return redirect(reverse("collection:retrieve", args=[id]))
# return redirect(reverse("collection:retrieve", args=[id]))
return retrieve_entity_list(request, id)
else:
return HttpResponseBadRequest()
@ -265,7 +291,8 @@ def delete_item(request, id, item_id):
if item is not None and item.collection == collection:
item.delete()
# collection.save()
return HTTPResponseHXRedirect(redirect_to=reverse("collection:retrieve", args=[id]))
# return HTTPResponseHXRedirect(redirect_to=reverse("collection:retrieve", args=[id]))
return retrieve_entity_list(request, id)
return HttpResponseBadRequest()
@ -286,7 +313,8 @@ def move_up_item(request, id, item_id):
o.save()
item.save()
# collection.save()
return HTTPResponseHXRedirect(redirect_to=reverse("collection:retrieve", args=[id]))
# return HTTPResponseHXRedirect(redirect_to=reverse("collection:retrieve", args=[id]))
return retrieve_entity_list(request, id)
return HttpResponseBadRequest()
@ -307,7 +335,8 @@ def move_down_item(request, id, item_id):
o.save()
item.save()
# collection.save()
return HTTPResponseHXRedirect(redirect_to=reverse("collection:retrieve", args=[id]))
# return HTTPResponseHXRedirect(redirect_to=reverse("collection:retrieve", args=[id]))
return retrieve_entity_list(request, id)
return HttpResponseBadRequest()