Optom

Running

App Files Files Community

Kgshop commited on Mar 25

Commit

8d8ebcc

verified ·

1 Parent(s): 6a7469c

Update app.py

Browse files

Files changed (1) hide show

app.py +262 -23

app.py CHANGED Viewed

@@ -11,9 +11,9 @@ from huggingface_hub.utils import RepositoryNotFoundError
 from werkzeug.utils import secure_filename
 app = Flask(__name__)
-DATA_FILE = 'data_kanc.json'
-REPO_ID = "Kgshop/clients"
 HF_TOKEN_WRITE = os.getenv("HF_TOKEN")
 HF_TOKEN_READ = os.getenv("HF_TOKEN_READ")
@@ -105,7 +105,7 @@ def catalog():
         <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/10.2.0/swiper-bundle.min.css">
         <style>
-            * {
                 margin: 0;
                 padding: 0;
                 box-sizing: border-box;
@@ -480,7 +480,6 @@ def catalog():
                 font-weight: 500;
             }
-            /* Styles for Address and Schedule */
             .info-section {
                 text-align: center;
                 margin: 20px 0;
@@ -811,15 +810,218 @@ def catalog():
     </body>
     </html>
     '''
-    return render_template_string(favorites_html, products=products, repo_id=REPO_ID)
-@app.route('/discounts')
-def discounts_page():
     data = load_data()
-    products = [p for p in data['products'] if p.get('discount')]
-    discounts_html = '''
     <!DOCTYPE html>
     <html lang="ru">
     <head>
@@ -1277,10 +1479,11 @@ def discounts_page():
                 <i class="fas fa-heart"></i>
                 Избранное
             </a>
-            <a href="/discounts" class="active">
                 <i class="fas fa-tag"></i>
                 Скидки
             </a>
             <a href="https://api.whatsapp.com/send?phone=996700666692">
                 <i class="fab fa-whatsapp"></i>
                 WhatsApp
@@ -1307,6 +1510,51 @@ def discounts_page():
                 document.querySelector('.theme-toggle i').classList.replace('fa-moon', 'fa-sun');
             }
             function openModal(index) {
                 loadProductDetails(index);
                 document.getElementById('productModal').style.display = "block";
@@ -1467,16 +1715,7 @@ def discounts_page():
                     favoriteButton.classList.add('favorited');
                 }
                 localStorage.setItem('favorites', JSON.stringify(favorites));
-            }
-            function loadFavorites() {
-                const favorites = JSON.parse(localStorage.getItem('favorites') || '[]');
-                document.querySelectorAll('.favorite-button').forEach(button => {
-                    const index = button.getAttribute('onclick').match(/\d+/)[0];
-                    if (favorites.includes(index)) {
-                        button.classList.add('favorited');
-                    }
-                });
             }
             window.onclick = function(event) {
@@ -1484,7 +1723,7 @@ def discounts_page():
             }
             updateCartButton();
-            loadFavorites();
         </script>
     </body>
     </html>
@@ -1630,7 +1869,7 @@ def admin():
                     filename = secure_filename(photo.filename)
                     api = HfApi()
                     api.upload_file(
-                        path_or_fileobj=photo,
                         path_in_repo=f"photos/{filename}",
                         repo_id=REPO_ID,
                         repo_type="dataset",
@@ -1661,7 +1900,7 @@ def admin():
                     filename = secure_filename(photo.filename)
                     api = HfApi()
                     api.upload_file(
-                        path_or_fileobj=photo,
                         path_in_repo=f"photos/{filename}",
                         repo_id=REPO_ID,
                         repo_type="dataset",

 from werkzeug.utils import secure_filename
 app = Flask(__name__)
+DATA_FILE = 'data_firecollection.json'
+REPO_ID = "Kgshop/Clients2"
 HF_TOKEN_WRITE = os.getenv("HF_TOKEN")
 HF_TOKEN_READ = os.getenv("HF_TOKEN_READ")
         <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/10.2.0/swiper-bundle.min.css">
         <style>
+           * {
                 margin: 0;
                 padding: 0;
                 box-sizing: border-box;
                 font-weight: 500;
             }
             .info-section {
                 text-align: center;
                 margin: 20px 0;
     </body>
     </html>
     '''
+    return render_template_string(catalog_html, products=products, repo_id=REPO_ID)
+@app.route('/categories')
+def categories_page():
+    data = load_data()
+    categories = data['categories']
+    categories_html = '''
+    <!DOCTYPE html>
+    <html lang="ru">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Fire collection</title>
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
+        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
+        <style>
+            * {
+                margin: 0;
+                padding: 0;
+                box-sizing: border-box;
+            }
+            body {
+                font-family: 'Roboto', sans-serif;
+                background: linear-gradient(135deg, #f5f7fa, #e4e7eb);
+                color: #333;
+                line-height: 1.6;
+                transition: background 0.3s, color 0.3s;
+                padding-bottom: 60px;
+            }
+            body.dark-mode {
+                background: linear-gradient(135deg, #1a1a2e, #2a2a3e);
+                color: #e0e0e0;
+            }
+            .container {
+                max-width: 1400px;
+                margin: 0 auto;
+                padding: 20px;
+            }
+            .header {
+                display: flex;
+                justify-content: space-between;
+                align-items: center;
+                padding: 15px 0;
+                border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+            }
+            .header h1 {
+                font-size: 2rem;
+                font-weight: 700;
+                letter-spacing: 1px;
+                background: linear-gradient(90deg, #526df2, #7a8ff5);
+                -webkit-background-clip: text;
+                -webkit-text-fill-color: transparent;
+            }
+            .theme-toggle {
+                background: none;
+                border: none;
+                font-size: 1.5rem;
+                cursor: pointer;
+                color: #666;
+                transition: color 0.3s ease;
+            }
+            .theme-toggle:hover {
+                color: #526df2;
+            }
+            body.dark-mode .theme-toggle {
+                color: #bbb;
+            }
+            .categories-grid {
+                display: grid;
+                grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+                gap: 20px;
+                padding: 10px;
+            }
+            .category-item {
+                background: rgba(255, 255, 255, 0.8);
+                border: 1px solid rgba(0, 0, 0, 0.05);
+                border-radius: 15px;
+                padding: 20px;
+                text-align: center;
+                box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
+                transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease, background 0.3s ease;
+                text-decoration: none;
+                color: #333;
+            }
+            body.dark-mode .category-item {
+                background: rgba(42, 42, 62, 0.8);
+                border-color: rgba(255, 255, 255, 0.05);
+                color: #e0e0e0;
+            }
+            .category-item:hover {
+                transform: translateY(-5px);
+                box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
+                background: rgba(255, 255, 255, 0.9);
+                background-color: #526df2;
+                color: white;
+            }
+            body.dark-mode .category-item:hover {
+                background: rgba(42, 42, 62, 0.9);
+                box-shadow: 0 8px 25px rgba(255, 255, 255, 0.1);
+            }
+            .category-item h2 {
+                font-size: 1.2rem;
+                font-weight: 500;
+            }
+            .navbar {
+                position: fixed;
+                bottom: 0;
+                left: 0;
+                width: 100%;
+                background-color: #fff;
+                box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
+                display: flex;
+                justify-content: space-around;
+                padding: 10px 0;
+                z-index: 1000;
+            }
+            body.dark-mode .navbar {
+                background-color: #2a2a3e;
+            }
+            .navbar a {
+                text-align: center;
+                color: #666;
+                text-decoration: none;
+                font-size: 0.9rem;
+                transition: color 0.3s ease;
+            }
+            .navbar a.active {
+                color: #526df2;
+            }
+            .navbar a i {
+                display: block;
+                font-size: 1.5rem;
+                margin-bottom: 5px;
+            }
+            body.dark-mode .navbar a {
+                color: #bbb;
+            }
+            .navbar a:hover {
+                color: #526df2;
+            }
+        </style>
+    </head>
+    <body>
+        <div class="container">
+            <div class="header">
+                <img src="https://huggingface.co/spaces/Kgshop/Fire-collection/resolve/main/Picsart_25-03-25_11-40-25-730.jpg" alt="Fire collection Logo" style="max-height: 50px;">
+                <button class="theme-toggle" onclick="toggleTheme()">
+                    <i class="fas fa-moon"></i>
+                </button>
+            </div>
+            <div class="categories-grid">
+                {% for category in categories %}
+                <a href="{{ url_for('category_products', category=category) }}" class="category-item">
+                    <h2>{{ category }}</h2>
+                </a>
+                {% endfor %}
+            </div>
+        </div>
+        <div class="navbar">
+            <a href="/">
+                <i class="fas fa-home"></i>
+                Главная
+            </a>
+            <a href="/categories" class="active">
+                <i class="fas fa-list"></i>
+                Каталог
+            </a>
+            <a href="/favorites">
+                <i class="fas fa-heart"></i>
+                Избранное
+            </a>
+            <a href="/discounts">
+                <i class="fas fa-tag"></i>
+                Скидки
+            </a>
+            <a href="https://api.whatsapp.com/send?phone=996700666692">
+                <i class="fab fa-whatsapp"></i>
+                WhatsApp
+            </a>
+        </div>
+        <script>
+            function toggleTheme() {
+                document.body.classList.toggle('dark-mode');
+                const icon = document.querySelector('.theme-toggle i');
+                icon.classList.toggle('fa-moon');
+                icon.classList.toggle('fa-sun');
+                localStorage.setItem('theme', document.body.classList.contains('dark-mode') ? 'dark' : 'light');
+            }
+            if (localStorage.getItem('theme') === 'dark') {
+                document.body.classList.add('dark-mode');
+                document.querySelector('.theme-toggle i').classList.replace('fa-moon', 'fa-sun');
+            }
+            window.onclick = function(event) {
+                if (event.target.className === 'modal') event.target.style.display = "none";
+            }
+        </script>
+    </body>
+    </html>
+    '''
+    return render_template_string(categories_html, categories=categories)
+@app.route('/category/<category>')
+def category_products(category):
     data = load_data()
+    products = [p for p in data['products'] if p.get('category') == category]
+    category_html = '''
     <!DOCTYPE html>
     <html lang="ru">
     <head>
                 <i class="fas fa-heart"></i>
                 Избранное
             </a>
+            <a href="/discounts">
                 <i class="fas fa-tag"></i>
                 Скидки
             </a>
             <a href="https://api.whatsapp.com/send?phone=996700666692">
                 <i class="fab fa-whatsapp"></i>
                 WhatsApp
                 document.querySelector('.theme-toggle i').classList.replace('fa-moon', 'fa-sun');
             }
+            function loadFavoritesPage() {
+                const favorites = JSON.parse(localStorage.getItem('favorites') || '[]');
+                const productsGrid = document.getElementById('products-grid');
+                productsGrid.innerHTML = '';
+                if (favorites.length === 0) {
+                    productsGrid.innerHTML = '<p>Избранное пусто</p>';
+                    return;
+                }
+                favorites.forEach(index => {
+                    const product = products[index];
+                    if (!product) return;
+                    const productElement = document.createElement('div');
+                    productElement.className = 'product';
+                    productElement.setAttribute('onclick', `openModal(${index})`);
+                    productElement.setAttribute('data-name', product.name.toLowerCase());
+                    productElement.setAttribute('data-description', product.description.toLowerCase());
+                    productElement.setAttribute('data-category', product.category || 'Без категории');
+                    productElement.innerHTML = `
+                        <button class="favorite-button favorited" onclick="event.stopPropagation(); toggleFavorite(${index})">
+                            <i class="fas fa-heart"></i>
+                        </button>
+                        ${product.photos && product.photos.length > 0 ? `
+                        <div class="product-image">
+                            <img src="https://huggingface.co/datasets/{{ repo_id }}/resolve/main/photos/${product.photos[0]}" alt="${product.name}" loading="lazy">
+                        </div>` : ''}
+                        ${product.discount ? `<span class="discount-badge">Скидка ${product.discount}%</span>` : ''}
+                        <h2>${product.name}</h2>
+                        <div class="product-price">
+                            {% if product.get('discount') %}
+                            <span style="text-decoration: line-through; color: #666;">{{ product['price'] }} с</span>
+                            <span>{{ (product['price'] * (1 - product.discount / 100)).toFixed(2)} с</span>
+                            <span class="discount">Скидка: {{ product['discount'] }}%</span>
+                            {% else %}
+                            <span>{{ product['price'] }} с</span>
+                            {% endif %}
+                        </div>
+                        <p class="product-description">${product.description.slice(0, 50)}${product.description.length > 50 ? '...' : ''}</p>
+                        <button class="product-button add-to-cart" onclick="event.stopPropagation(); openQuantityModal(${index})">В корзину</button>
+                    `;
+                    productsGrid.appendChild(productElement);
+                });
+            }
             function openModal(index) {
                 loadProductDetails(index);
                 document.getElementById('productModal').style.display = "block";
                     favoriteButton.classList.add('favorited');
                 }
                 localStorage.setItem('favorites', JSON.stringify(favorites));
+                loadFavoritesPage();
             }
             window.onclick = function(event) {
             }
             updateCartButton();
+            loadFavoritesPage();
         </script>
     </body>
     </html>
                     filename = secure_filename(photo.filename)
                     api = HfApi()
                     api.upload_file(
+                        path_or_fileobj=photo.stream, # Use photo.stream instead of photo
                         path_in_repo=f"photos/{filename}",
                         repo_id=REPO_ID,
                         repo_type="dataset",
                     filename = secure_filename(photo.filename)
                     api = HfApi()
                     api.upload_file(
+                        path_or_fileobj=photo.stream, # Use photo.stream instead of photo
                         path_in_repo=f"photos/{filename}",
                         repo_id=REPO_ID,
                         repo_type="dataset",