Easy way of check amiibo from listings
This commit is contained in:
parent
b0cb057ed3
commit
879dd04d46
|
@ -87,9 +87,14 @@ class UserAmiiboView(View):
|
||||||
'+-trade': 'toggle_trade',
|
'+-trade': 'toggle_trade',
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ajax = {
|
||||||
|
'detail': 'amiibo/widgets/relation_header_buttons.html',
|
||||||
|
'list': 'amiibo/widgets/amiibo-card.html',
|
||||||
|
}
|
||||||
|
|
||||||
def get(self, request, amiibo, action):
|
def get(self, request, amiibo, action):
|
||||||
amiibo = get_object_or_404(Amiibo, pk=amiibo)
|
obj = get_object_or_404(Amiibo, pk=amiibo)
|
||||||
# amiibo = obj.as_type()
|
amiibo = obj.as_type()
|
||||||
if action in self.actions:
|
if action in self.actions:
|
||||||
method = getattr(self, self.actions[action], None)
|
method = getattr(self, self.actions[action], None)
|
||||||
if method:
|
if method:
|
||||||
|
@ -99,13 +104,9 @@ class UserAmiiboView(View):
|
||||||
|
|
||||||
# Handle templating
|
# Handle templating
|
||||||
request_from = request.GET.get('from', None)
|
request_from = request.GET.get('from', None)
|
||||||
if request_from == 'detail':
|
if request_from in self.ajax:
|
||||||
return render(request,
|
return render(request, self.ajax[request_from],
|
||||||
'amiibo/widgets/relation_header_buttons.html',
|
{ 'amiibo': amiibo, 'request': request })
|
||||||
{
|
|
||||||
'amiibo': amiibo,
|
|
||||||
'item': amiibo
|
|
||||||
})
|
|
||||||
|
|
||||||
return HttpResponseRedirect(amiibo.as_type().get_absolute_url())
|
return HttpResponseRedirect(amiibo.as_type().get_absolute_url())
|
||||||
|
|
||||||
|
@ -120,12 +121,12 @@ class UserAmiiboView(View):
|
||||||
def add_trade(self, request, amiibo):
|
def add_trade(self, request, amiibo):
|
||||||
if services.is_owned_by(amiibo, request.user):
|
if services.is_owned_by(amiibo, request.user):
|
||||||
services.user_add_trade(request.user, amiibo)
|
services.user_add_trade(request.user, amiibo)
|
||||||
# TODO: Add message
|
# TODO: Add message
|
||||||
|
|
||||||
def remove_trade(self, request, amiibo):
|
def remove_trade(self, request, amiibo):
|
||||||
if services.is_owned_by(amiibo, request.user):
|
if services.is_owned_by(amiibo, request.user):
|
||||||
services.user_remove_trade(request.user, amiibo)
|
services.user_remove_trade(request.user, amiibo)
|
||||||
# TODO: Add message
|
# TODO: Add message
|
||||||
|
|
||||||
def toggle_trade(self, request, amiibo):
|
def toggle_trade(self, request, amiibo):
|
||||||
if services.is_owned_by(amiibo, request.user):
|
if services.is_owned_by(amiibo, request.user):
|
||||||
|
|
|
@ -16,6 +16,12 @@ $(function(){
|
||||||
position: 'left center'
|
position: 'left center'
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$(document).on('click', '[data-toggle]', function(event) {
|
||||||
|
var $el = event.target;
|
||||||
|
var $target = $($el.getAttribute('data-toggle'));
|
||||||
|
$target.slideToggle(200);
|
||||||
|
});
|
||||||
|
|
||||||
$('.right.menu.open').on("click",function(e){
|
$('.right.menu.open').on("click",function(e){
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
$('.ui.vertical.menu').toggle();
|
$('.ui.vertical.menu').toggle();
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
(function() {
|
(function() {
|
||||||
var RelationComponent = function() {
|
var RelationComponent = function() {
|
||||||
this.relations = document.querySelectorAll('[data-handle="relation"]');
|
this.relationsQuerySelector = '[data-handle="relation"]';
|
||||||
this.initialize();
|
this.initialize();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -10,12 +10,18 @@
|
||||||
// Prepare handlers
|
// Prepare handlers
|
||||||
var linkHandler = function(event) {
|
var linkHandler = function(event) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
self.click(event.target);
|
event.stopPropagation();
|
||||||
|
|
||||||
|
var target = event.target;
|
||||||
|
|
||||||
|
// Handles clicking in the icon
|
||||||
|
if (event.target.href === undefined)
|
||||||
|
target = event.target.parentNode
|
||||||
|
|
||||||
|
self.click(target);
|
||||||
};
|
};
|
||||||
|
|
||||||
[].forEach.call(this.relations, function(buttons) {
|
$(document).on('click', this.relationsQuerySelector + ' a', linkHandler);
|
||||||
$(buttons).on('click', 'a', linkHandler);
|
|
||||||
});
|
|
||||||
};
|
};
|
||||||
|
|
||||||
RelationComponent.prototype.click = function(element) {
|
RelationComponent.prototype.click = function(element) {
|
||||||
|
@ -32,17 +38,24 @@
|
||||||
var self = this;
|
var self = this;
|
||||||
// loader.addClass('loading');
|
// loader.addClass('loading');
|
||||||
|
|
||||||
|
// If list, the entire card is the container
|
||||||
|
if (from === "list") container = loader;
|
||||||
|
|
||||||
$.ajax({
|
$.ajax({
|
||||||
url: href,
|
url: href,
|
||||||
data: { from: from },
|
data: { from: from },
|
||||||
success: function(result) {
|
success: function(result) {
|
||||||
self.handleResult(loader, container, result);
|
self.handleResult(loader, from, container, result);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
RelationComponent.prototype.handleResult = function(loader, container, result) {
|
RelationComponent.prototype.handleResult = function(loader, from, container, result) {
|
||||||
container.html(result)
|
if (from === 'list') {
|
||||||
|
container.replaceWith(result);
|
||||||
|
} else {
|
||||||
|
container.html(result)
|
||||||
|
}
|
||||||
// loader.removeClass('loading');
|
// loader.removeClass('loading');
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
// Semantic-UI
|
// Semantic-UI
|
||||||
@import "../semantic/semantic.css";
|
@import "../semantic/semantic.min.css";
|
||||||
|
|
||||||
|
|
||||||
.price-converted {
|
.price-converted {
|
||||||
|
@ -10,6 +10,10 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hidden {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
.underlined {
|
.underlined {
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
|
@ -34,4 +38,14 @@
|
||||||
|
|
||||||
.nowrap {
|
.nowrap {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.relation-buttons {
|
||||||
|
position: absolute;
|
||||||
|
left: 6px;
|
||||||
|
right: 6px;
|
||||||
|
bottom: 6px;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
z-index: 30;
|
||||||
|
}
|
||||||
|
|
|
@ -19,7 +19,7 @@
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block js_views %}{{ block.super }},collection-search{% endblock %}
|
{% block js_views %}{{ block.super }},collection-search,relation{% endblock %}
|
||||||
|
|
||||||
{% block main_content %}
|
{% block main_content %}
|
||||||
<div class="ui page grid">
|
<div class="ui page grid">
|
||||||
|
|
|
@ -1,18 +1,32 @@
|
||||||
{% load staticfiles thumbnail i18n %}
|
{% load staticfiles thumbnail i18n %}
|
||||||
|
|
||||||
<div class="ui link card
|
<div class="ui link card
|
||||||
{% if amiibo.pk in USER_AMIIBO_WISHLIST %}yellow{% endif %}
|
{% if amiibo.pk in USER_AMIIBO_WISHLIST %}yellow{% endif %}
|
||||||
{% if amiibo.pk in USER_AMIIBO_OWNED %}green{% endif %}
|
{% if amiibo.pk in USER_AMIIBO_OWNED %}green{% endif %}
|
||||||
{% if amiibo.pk in USER_AMIIBO_TRADE %}teal{% endif %}" data-amiibo-names="{{ amiibo.get_all_names|lower }}" data-href="{{ amiibo.get_absolute_url }}">
|
{% if amiibo.pk in USER_AMIIBO_TRADE %}teal{% endif %}"
|
||||||
<div class="image">
|
data-amiibo-names="{{ amiibo.get_all_names|lower }}"
|
||||||
<div class="ui fluid image">
|
data-loader="{{ amiibo.pk }}">
|
||||||
{% if amiibo.is_card %}
|
<a href="{{ amiibo.get_absolute_url }}">
|
||||||
<img src="{% thumbnail amiibo.image "240x340" crop %}" alt="{{ amiibo.name }}">
|
<div class="image">
|
||||||
{% else %}
|
<div class="ui fluid image">
|
||||||
<img src="{% thumbnail amiibo.image "340x340" crop %}" alt="{{ amiibo.name }}">
|
{% if amiibo.is_card %}
|
||||||
|
<img src="{% thumbnail amiibo.image "240x340" crop %}" alt="{{ amiibo.name }}">
|
||||||
|
{% else %}
|
||||||
|
<img src="{% thumbnail amiibo.image "340x340" crop %}" alt="{{ amiibo.name }}">
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
{% if request.user.is_authenticated %}
|
||||||
|
<div class="relation-buttons"
|
||||||
|
id="amiibo-buttons-{{ amiibo.pk }}"
|
||||||
|
data-handle="relation"
|
||||||
|
data-from="list"
|
||||||
|
data-amiibo="{{ amiibo.pk }}">
|
||||||
|
{% include 'amiibo/widgets/relation_list_buttons.html' %}
|
||||||
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</a>
|
||||||
<div class="content text-center">
|
<div class="content text-center">
|
||||||
<div class="header">{{ amiibo.name }}</div>
|
<a href="{{ amiibo.get_absolute_url }}" class="header">{{ amiibo.name }}</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -0,0 +1,21 @@
|
||||||
|
{% load i18n %}
|
||||||
|
|
||||||
|
{% if amiibo.pk in USER_AMIIBO_OWNED %}
|
||||||
|
<a href="{% url 'amiibo:user-action' amiibo=amiibo.pk action='+-trade' %}"
|
||||||
|
class="ui icon button tiny {% if amiibo.pk in USER_AMIIBO_TRADE %}teal{% endif %}">
|
||||||
|
<i class="{% if amiibo.pk in USER_AMIIBO_TRADE %}check{% else %}cancel{% endif %} icon"></i>
|
||||||
|
<i class="ui icon retweet"></i>
|
||||||
|
</a>
|
||||||
|
<a href="{% url 'amiibo:user-action' amiibo=amiibo.pk action='-owned' %}"
|
||||||
|
class="ui button icon red tiny"><i class="ui icon cancel"></i></a>
|
||||||
|
{% else %}
|
||||||
|
<a href="{% url 'amiibo:user-action' amiibo=amiibo.pk action='+owned' %}"
|
||||||
|
class="ui button icon green tiny"><i class="ui icon check"></i></a>
|
||||||
|
{% if amiibo.pk in USER_AMIIBO_WISHLIST %}
|
||||||
|
<a href="{% url 'amiibo:user-action' amiibo=amiibo.pk action='-wishlist' %}"
|
||||||
|
class="ui button icon yellow tiny"><i class="ui icon star"></i></a>
|
||||||
|
{% else %}
|
||||||
|
<a href="{% url 'amiibo:user-action' amiibo=amiibo.pk action='+wishlist' %}"
|
||||||
|
class="ui icon button tiny"><i class="ui icon star"></i></a>
|
||||||
|
{% endif %}
|
||||||
|
{% endif %}
|
Loading…
Reference in New Issue