badblocks/pkmntrade.club
1
1
Fork 0
Code Issues 14 Pull requests Projects 1 Releases Packages Wiki Activity

Initial working version with minor bugs

Browse source
This commit is contained in:
badblocks 2025-02-26 00:06:42 -08:00
parent f946e4933a
commit 71b3993326
83 changed files with 34485 additions and 173 deletions
Download patch file Download diff file Expand all files Collapse all files

42
templates/home/_search_results.html Normal file
View file

@ -0,0 +1,42 @@
{% load trade_offer_tags %}
{% if offered_cards or wanted_cards %}
<hr class="my-5">
<h2 class="mb-4">Results</h2>
{% if search_results and search_results.object_list %}
<ul class="list-group">
{% for offer in search_results %}
<li class="list-group-item border-0">
<a href="{% url 'trade_offer_update' offer.pk %}" class="d-flex align-items-center text-decoration-none">
{% render_trade_offer offer %}
</a>
</li>
{% endfor %}
</ul>
<!-- Pagination Controls -->
<nav aria-label="Search results pagination" class="mt-4">
<ul class="pagination">
{% if search_results.has_previous %}
<li class="page-item">
<a class="page-link ajax-page-link" data-page="{{ search_results.previous_page_number }}" href="#">Previous</a>
</li>
{% else %}
<li class="page-item disabled"><span class="page-link">Previous</span></li>
{% endif %}
{% for num in search_results.paginator.page_range %}
<li class="page-item {% if search_results.number == num %}active{% endif %}">
<a class="page-link ajax-page-link" data-page="{{ num }}" href="#">{{ num }}</a>
</li>
{% endfor %}
{% if search_results.has_next %}
<li class="page-item">
<a class="page-link ajax-page-link" data-page="{{ search_results.next_page_number }}" href="#">Next</a>
</li>
{% else %}
<li class="page-item disabled"><span class="page-link">Next</span></li>
{% endif %}
</ul>
</nav>
{% else %}
<div class="alert alert-info">No trade offers found.</div>
{% endif %}
{% endif %}

239
templates/home/home.html Normal file
View file

@ -0,0 +1,239 @@
{% extends '_base.html' %}
{% load static %}
{% load trade_offer_tags card_badge %}
{% load cache %}
{% load card_multiselect %}
{% block content %}
<main class="container my-5">
<h1 class="text-center mb-5">Welcome to Pocket.Trade</h1>
<!-- Search Form Section -->
<section id="trade-search" class="mb-5">
<form method="post" action=".">
{% csrf_token %}
<div class="row">
<div class="col-md-6 mb-3">
{% card_multiselect "offered_cards" "Have:" available_cards "Select zero or more cards..." offered_cards %}
</div>
<div class="col-md-6 mb-3">
{% card_multiselect "wanted_cards" "Want:" available_cards "Select zero or more cards..." wanted_cards %}
</div>
</div>
<button type="submit" class="btn btn-primary w-100">Find a Trade Offer</button>
</form>
</section>
<!-- Search Results Section -->
<section id="search-results">
{% include "home/_search_results.html" %}
</section>
<!-- Market Stats Section -->
<section aria-labelledby="stats-heading" class="mb-5">
<h2 id="stats-heading" class="mb-4">Market Stats</h2>
<div class="row gx-5">
<!-- Most Offered Cards (cached for 3600 seconds / 1 hour) -->
<div class="col-md-6 mb-3">
<h5 class="mb-3">Most Offered Cards</h5>
<div class="card h-100 shadow border-0">
<div class="card-body">
{% cache 3600 most_offered_cards %}
{% if most_offered_cards %}
<div class="d-flex flex-column gap-3">
{% for card in most_offered_cards %}
{% if card.offer_count > 0 %}
<a href="?wanted_cards={{ card.id }}"
class="d-flex justify-content-between align-items-center text-decoration-none text-primary">
{% card_badge card %}
<span>{{ card.offer_count }}</span>
</a>
{% endif %}
{% endfor %}
</div>
{% else %}
<p>No cards found</p>
{% endif %}
{% endcache %}
</div>
</div>
</div>
<!-- Most Wanted Cards (cached for 3600 seconds / 1 hour) -->
<div class="col-md-6 mb-3">
<h5 class="mb-3">Most Wanted Cards</h5>
<div class="card h-100 shadow border-0">
<div class="card-body">
{% cache 3600 most_wanted_cards %}
{% if most_wanted_cards %}
<div class="d-flex flex-column gap-3">
{% for card in most_wanted_cards %}
{% if card.offer_count > 0 %}
<a href="?offered_cards={{ card.id }}"
class="d-flex justify-content-between align-items-center text-decoration-none text-primary">
{% card_badge card %}
<span>{{ card.offer_count }}</span>
</a>
{% endif %}
{% endfor %}
</div>
{% else %}
<p>No cards found</p>
{% endif %}
{% endcache %}
</div>
</div>
</div>
</div>
</section>
<!-- Featured Offers and Recent Offers Section -->
<div class="row mb-5">
<!-- Featured Offers Card (cached for 86400 seconds / 1 day) -->
<div class="col-md-6 mb-3">
{% cache 86400 featured_offers %}
<div class="card h-100 border-0">
<div class="card-header border-0 bg-transparent">
<h5 class="card-title mb-0">Featured Offers</h5>
<ul class="nav nav-tabs card-header-tabs mt-3" id="cardsetTabs" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link active" id="all-tab" data-bs-toggle="tab" data-bs-target="#all"
type="button" role="tab" aria-controls="all" aria-selected="true">All</button>
</li>
{% for cardset, offers in featured_offers.items %}
{% if cardset != "All" %}
<li class="nav-item" role="presentation">
<button class="nav-link" id="{{ cardset|slugify }}-tab" data-bs-toggle="tab" data-bs-target="#{{ cardset|slugify }}"
type="button" role="tab" aria-controls="{{ cardset|slugify }}" aria-selected="false">
{{ cardset }}
</button>
</li>
{% endif %}
{% endfor %}
</ul>
</div>
<div class="card-body">
<div class="tab-content" id="cardsetTabsContent">
<!-- All Offers Tab Pane -->
<div class="tab-pane fade show active" id="all" role="tabpanel" aria-labelledby="all-tab">
{% if featured_offers.All %}
<div class="d-flex flex-column gap-3">
{% for offer in featured_offers.All %}
<a href="{% url 'trade_offer_update' offer.pk %}" class="d-flex align-items-center text-decoration-none">
{% render_trade_offer offer %}
</a>
{% endfor %}
</div>
{% else %}
<p>No featured offers available.</p>
{% endif %}
</div>
<!-- Other Cardset Tab Panes -->
{% for cardset, offers in featured_offers.items %}
{% if cardset != "All" %}
<div class="tab-pane fade" id="{{ cardset|slugify }}" role="tabpanel" aria-labelledby="{{ cardset|slugify }}-tab">
{% if offers %}
<div class="d-flex flex-column gap-3">
{% for offer in offers %}
<a href="{% url 'trade_offer_update' offer.pk %}" class="d-flex align-items-center text-decoration-none">
{% render_trade_offer offer %}
</a>
{% endfor %}
</div>
{% else %}
<p>No featured offers for {{ cardset }}.</p>
{% endif %}
</div>
{% endif %}
{% endfor %}
</div>
</div>
</div>
{% endcache %}
</div>
<!-- Recent Offers Card (cached for 60 seconds) -->
<div class="col-md-6 mb-3">
{% cache 60 recent_offers %}
<div class="card h-100 border-0">
<div class="card-body">
<h5 class="card-title">Recent Offers</h5>
<div class="d-flex flex-column gap-3">
{% for offer in recent_offers %}
<a href="{% url 'trade_offer_update' offer.pk %}" class="text-decoration-none">
{% render_trade_offer offer %}
</a>
{% empty %}
<div>No offers available</div>
{% endfor %}
</div>
</div>
</div>
{% endcache %}
</div>
</div>
</main>
{% endblock content %}
{% block javascript %}
<!-- <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script> -->
<script>
$(document).ready(function () {
// function formatOption(option) {
// if (!option.id) return option.text;
// var $option = $(option.element);
// var cardName = $option.data('name');
// var rarity = $option.data('rarity');
// var cardset = $option.data('cardset');
// var style = $option.data('style');
// return $('<span>').text(cardName + " " + rarity + " " + cardset).attr('style', style);
// }
// $('.select2-field').select2({
// placeholder: function() {
// return $(this).data('placeholder');
// },
// templateResult: formatOption,
// templateSelection: formatOption,
// width: '100%',
// dropdownAutoWidth: true,
// allowClear: true
// });
// AJAX form submission for trade search
$("#trade-search form").on('submit', function(e) {
e.preventDefault();
$.ajax({
type: $(this).attr("method"),
url: $(this).attr("action"),
data: $(this).serialize(),
headers: { "X-Requested-With": "XMLHttpRequest" },
success: function(data) {
$("#search-results").html(data);
},
error: function() {
alert("There was an error processing your search.");
}
});
});
// AJAX pagination for search results
$(document).on('click', '.ajax-page-link', function(e){
e.preventDefault();
var page = $(this).data('page');
if($("#page").length) {
$("#page").val(page);
} else {
$("<input>").attr({
type: "hidden",
id: "page",
name: "page",
value: page
}).appendTo("#trade-search form");
}
$("#trade-search form").submit();
});
});
</script>
{% endblock %}