Ryan Westfall
9040021d1b
bounty board feature buyers to see bounty boards seller profile page (like have theme chooser) Have the game and set name be filters. Add cards to vault manually update card inventory add to have the autocomplete for the card - store analytics, clicks, views, link to store (url/QR code) bulk item inventory creation -- Make the banner feature flag driven so I can have a beta site setup like the primary site don't use primary key values in urls - update to use uuid4 values site analytics. tianji is being sent item potent on the mtg and lorcana populate scripts Card item images for specific listings check that when you buy a card it is in the vault Buys should be able to search on store inventories More pie charts for the seller! post bounty board is slow to load seller reviews/ratings - show a historgram - need a way for someone to rate Report a seller feature for buyer to report Make sure the stlying is consistent based on the theme choosen smart minimum order quantity and shipping amounts (defined by the store itself) put virtual packs behind a feature flag like bounty board proxy service feature flag Terms of Service new description for TCGKof store SSN, ITIN, and EIN optomize for SEO
232 lines
12 KiB
HTML
232 lines
12 KiB
HTML
{% load static %}
|
|
<!DOCTYPE html>
|
|
<html lang="en" data-theme="{% if user.is_authenticated %}{{ user.profile.theme_preference }}{% else %}dark{% endif %}">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{% block title %}TCGKof - Premium TCG Store{% endblock %}</title>
|
|
<meta name="description" content="{% block meta_description %}TCGKof is the premier marketplace for trading card games. Buy and sell Magic: The Gathering, Lorcana, and more.{% endblock %}">
|
|
<meta name="keywords" content="{% block meta_keywords %}TCG, Magic: The Gathering, Lorcana, cards, marketplace, buy cards, sell cards{% endblock %}">
|
|
<link rel="canonical" href="{% block canonical_url %}{{ request.build_absolute_uri }}{% endblock %}">
|
|
|
|
<!-- Open Graph / Facebook -->
|
|
<meta property="og:type" content="{% block og_type %}website{% endblock %}">
|
|
<meta property="og:url" content="{{ request.build_absolute_uri }}">
|
|
<meta property="og:title" content="{% block og_title %}{{ self.title }}{% endblock %}">
|
|
<meta property="og:description" content="{% block og_description %}TCGKof is the premier marketplace for trading card games. Buy and sell Magic: The Gathering, Lorcana, and more.{% endblock %}">
|
|
<meta property="og:image" content="{% block og_image %}{{ request.scheme }}://{{ request.get_host }}{% static 'img/og-default.jpg' %}{% endblock %}">
|
|
|
|
<!-- Twitter -->
|
|
<meta property="twitter:card" content="summary_large_image">
|
|
<meta property="twitter:url" content="{{ request.build_absolute_uri }}">
|
|
<meta property="twitter:title" content="{% block twitter_title %}{{ self.title }}{% endblock %}">
|
|
<meta property="twitter:description" content="{% block twitter_description %}TCGKof is the premier marketplace for trading card games. Buy and sell Magic: The Gathering, Lorcana, and more.{% endblock %}">
|
|
<meta property="twitter:image" content="{% block twitter_image %}{{ request.scheme }}://{{ request.get_host }}{% static 'img/og-default.jpg' %}{% endblock %}">
|
|
|
|
<link rel="stylesheet" href="{% static 'css/style.css' %}">
|
|
{% if not debug %}
|
|
<script async defer src="https://tianji.aimloperations.com/tracker.js" data-website-id="cmklg5jenh4wx14nrurt5yqyl"></script>
|
|
{% endif %}
|
|
</head>
|
|
<body>
|
|
{% if FEATURE_DEMO_SITE %}
|
|
<div style="background: #f59e0b; color: #000; text-align: center; padding: 0.5rem; font-weight: 600; font-size: 0.875rem;">
|
|
DEMO SITE: This is an example application. No real products, payments, or purchases are processed.
|
|
</div>
|
|
{% endif %}
|
|
<nav>
|
|
<div style="display: flex; justify-content: space-between; align-items: center; width: 100%;">
|
|
<a href="{% url 'home' %}" class="nav-brand">TCGKof</a>
|
|
<button class="mobile-menu-btn" aria-label="Toggle Navigation">
|
|
<span class="bar"></span>
|
|
<span class="bar"></span>
|
|
<span class="bar"></span>
|
|
</button>
|
|
</div>
|
|
<div class="nav-links">
|
|
{% if user.is_authenticated %}
|
|
{% if user.seller_profile %}
|
|
{# Seller Navigation #}
|
|
<a href="{% url 'store:seller_dashboard' %}">Dashboard</a>
|
|
<a href="{% url 'store:manage_listings' %}">Store</a>
|
|
<a href="{% url 'store:manage_listings' %}">Inventory</a>
|
|
{% if debug %}
|
|
<a href="{% url 'store:bounty_list' %}">Bounties</a>
|
|
{% endif %}
|
|
<form action="{% url 'logout' %}" method="post" style="display:inline;">
|
|
{% csrf_token %}
|
|
<button type="submit" class="btn" style="background:none; color:var(--text-color); margin-left:1rem;">Logout</button>
|
|
</form>
|
|
{% elif user.buyer_profile %}
|
|
{# Buyer Navigation #}
|
|
<a href="{% url 'store:card_list' %}">Browse</a>
|
|
{% if FEATURE_VIRTUAL_PACKS %}
|
|
<a href="{% url 'store:pack_list' %}">Packs</a>
|
|
{% endif %}
|
|
<a href="{% url 'decks:deck_list' %}">Decks</a>
|
|
<a href="{% url 'users:vault' %}">Vault</a>
|
|
{% if FEATURE_VIRTUAL_PACKS %}
|
|
<a href="{% url 'store:my_packs' %}">My Packs</a>
|
|
{% endif %}
|
|
<a href="{% url 'store:cart' %}">Cart ({{ user.buyer_profile.cart.items.count|default:0 }})</a>
|
|
<a href="{% url 'users:profile' %}">Profile</a>
|
|
<a href="{% url 'store:bounty_list' %}">Bounties</a>
|
|
<form action="{% url 'logout' %}" method="post" style="display:inline;">
|
|
{% csrf_token %}
|
|
<button type="submit" class="btn" style="background:none; color:var(--text-color); margin-left:1rem;">Logout</button>
|
|
</form>
|
|
{% else %}
|
|
{# Fallback for incomplete profiles #}
|
|
<form action="{% url 'logout' %}" method="post" style="display:inline;">
|
|
{% csrf_token %}
|
|
<button type="submit" class="btn" style="background:none; color:var(--text-color);">Logout (Invalid Account)</button>
|
|
</form>
|
|
{% endif %}
|
|
|
|
{% if user.is_staff %}
|
|
<a href="{% url 'store:admin_revenue_dashboard' %}" style="color: #f59e0b;">Platform Admin</a>
|
|
{% endif %}
|
|
{% else %}
|
|
{# Public Navigation #}
|
|
<a href="{% url 'store:card_list' %}">Browse</a>
|
|
{% if FEATURE_VIRTUAL_PACKS %}
|
|
<a href="{% url 'store:pack_list' %}">Packs</a>
|
|
{% endif %}
|
|
{% if debug %}
|
|
<a href="{% url 'store:bounty_list' %}">Bounties</a>
|
|
{% endif %}
|
|
|
|
<a href="{% url 'decks:deck_list' %}"
|
|
class="auth-required"
|
|
data-feature-title="Deck Builder"
|
|
data-feature-desc="Build and save custom decks, analyze mana curves, and prepare your strategies for battle. Create an account to start building!">Decks</a>
|
|
|
|
<a href="{% url 'users:vault' %}"
|
|
class="auth-required"
|
|
data-feature-title="Collection Vault"
|
|
data-feature-desc="Track your entire card collection, monitor value trends, and manage your inventory in one place. Log in to access your Vault.">Vault</a>
|
|
|
|
{% if FEATURE_VIRTUAL_PACKS %}
|
|
<a href="{% url 'store:my_packs' %}"
|
|
class="auth-required"
|
|
data-feature-title="My Packs"
|
|
data-feature-desc="Open virtual packs, collect rare cards, and grow your digital library. Sign up now to start cracking packs!">My Packs</a>
|
|
{% endif %}
|
|
|
|
<a href="{% url 'login' %}">Login</a>
|
|
<a href="{% url 'users:register' %}">Register</a>
|
|
<a href="{% url 'store:seller_register' %}">Seller?</a>
|
|
{% endif %}
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="container">
|
|
{% if messages %}
|
|
<ul class="messages">
|
|
{% for message in messages %}
|
|
<li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% endif %}
|
|
|
|
{% block content %}
|
|
{% endblock %}
|
|
</div>
|
|
|
|
<footer style="background-color: #1e293b; border-top: 1px solid #334155; padding: 3rem 1rem; margin-top: 4rem; color: #94a3b8;">
|
|
<div class="container" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 2rem; max-width: 1200px; margin: 0 auto;">
|
|
<div style="text-align: left;">
|
|
<h3 style="color: #f59e0b; font-weight: 700; font-size: 1.25rem; margin-bottom: 1rem;">TCGKof</h3>
|
|
<p style="font-size: 0.875rem; line-height: 1.6;">The premier destination for trading card game buyers and sellers.</p>
|
|
<p style="font-size: 0.875rem;">© 2026 TCGKof Store.</p>
|
|
<p style="font-size: 0.875rem;">Operated by <a href="https://aimloperations.com" target="_blank" style="color: inherit; text-decoration: underline;">AI ML Operations, LLC</a></p>
|
|
</div>
|
|
<div style="text-align: left;">
|
|
<h4 style="color: #e2e8f0; font-weight: 600; margin-bottom: 1rem;">Sellers</h4>
|
|
<ul style="list-style: none; padding: 0;">
|
|
<li style="margin-bottom: 0.5rem;"><a href="{% url 'users:sell_on_tcgkof' %}" style="color: inherit; text-decoration: none; transition: color 0.2s;">Sell on TCGKof</a></li>
|
|
<li style="margin-bottom: 0.5rem;"><a href="{% url 'store:seller_register' %}" style="color: inherit; text-decoration: none; transition: color 0.2s;">Seller Registration</a></li>
|
|
</ul>
|
|
</div>
|
|
<div style="text-align: left;">
|
|
<h4 style="color: #e2e8f0; font-weight: 600; margin-bottom: 1rem;">Legal</h4>
|
|
<ul style="list-style: none; padding: 0;">
|
|
<li style="margin-bottom: 0.5rem;"><a href="{% url 'store:terms' %}" style="color: inherit; text-decoration: none; transition: color 0.2s;">Terms and Service</a></li>
|
|
</ul>
|
|
</div>
|
|
</footer>
|
|
|
|
{% if not user.is_authenticated %}
|
|
<div id="authModal" class="modal-overlay">
|
|
<div class="auth-modal">
|
|
<button class="close-modal" aria-label="Close modal">×</button>
|
|
<h2 id="modalTitle">Login Required</h2>
|
|
<p id="modalDesc">Please log in to access this feature.</p>
|
|
<div class="auth-modal-actions">
|
|
<a href="{% url 'login' %}" class="btn">Log In</a>
|
|
<a href="{% url 'users:register' %}" class="btn btn-outline">Create Account</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Mobile Menu Toggle
|
|
const mobileBtn = document.querySelector('.mobile-menu-btn');
|
|
const navLinks = document.querySelector('.nav-links');
|
|
|
|
if (mobileBtn) {
|
|
mobileBtn.addEventListener('click', function() {
|
|
navLinks.classList.toggle('active');
|
|
});
|
|
}
|
|
|
|
// Auth Modal Logic
|
|
const modal = document.getElementById('authModal');
|
|
if (modal) {
|
|
const closeBtn = document.querySelector('.close-modal');
|
|
const modalTitle = document.getElementById('modalTitle');
|
|
const modalDesc = document.getElementById('modalDesc');
|
|
const authLinks = document.querySelectorAll('.auth-required');
|
|
|
|
function openModal(title, desc) {
|
|
modalTitle.textContent = title;
|
|
modalDesc.textContent = desc;
|
|
modal.classList.add('active');
|
|
document.body.style.overflow = 'hidden';
|
|
}
|
|
|
|
function closeModal() {
|
|
modal.classList.remove('active');
|
|
document.body.style.overflow = '';
|
|
}
|
|
|
|
authLinks.forEach(link => {
|
|
link.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
const title = this.dataset.featureTitle || 'Login Required';
|
|
const desc = this.dataset.featureDesc || 'Please log in to access this feature.';
|
|
openModal(title, desc);
|
|
});
|
|
});
|
|
|
|
closeBtn.addEventListener('click', closeModal);
|
|
|
|
modal.addEventListener('click', function(e) {
|
|
if (e.target === modal) {
|
|
closeModal();
|
|
}
|
|
});
|
|
|
|
document.addEventListener('keydown', function(e) {
|
|
if (e.key === 'Escape' && modal.classList.contains('active')) {
|
|
closeModal();
|
|
}
|
|
});
|
|
}
|
|
});
|
|
</script>
|
|
{% endif %}
|
|
</body>
|
|
</html>
|