Spaces:

nock2
/

solana-nft-gripper

Running

App Files Files

xet

Community

nock2 commited on May 15

Commit

05b98a9

verified ·

1 Parent(s): e3b44d8

Add 3 files

Browse files

Files changed (3) hide show

README.md +7 -5
index.html +785 -19
prompts.txt +1 -0

README.md CHANGED Viewed

@@ -1,10 +1,12 @@
 ---
-title: Solana Nft Gripper
-emoji: 🏃
-colorFrom: pink
-colorTo: yellow
 sdk: static
 pinned: false
 ---
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

 ---
+title: solana-nft-gripper
+emoji: 🐳
+colorFrom: green
+colorTo: green
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html CHANGED Viewed

@@ -1,19 +1,785 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
-</html>

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>🌀 Solana Image Vortex 🌀</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <!-- Psychedelic fonts -->
+    <link href="https://fonts.googleapis.com/css2?family=Press+Start+2P&family=Comic+Neue:wght@700&family=VT323&display=swap" rel="stylesheet">
+    <style>
+        body {
+            background-color: #000;
+            background-image:
+                radial-gradient(circle at 10% 20%, rgba(255, 0, 255, 0.1) 0%, transparent 20%),
+                radial-gradient(circle at 90% 80%, rgba(0, 255, 255, 0.1) 0%, transparent 20%),
+                repeating-linear-gradient(
+                    45deg,
+                    #000,
+                    #000 2px,
+                    rgba(255, 255, 0, 0.05) 2px,
+                    rgba(255, 255, 0, 0.05) 4px
+                );
+            font-family: 'VT323', monospace;
+            color: #0f0;
+            text-shadow: 0 0 5px #0f0;
+        }
+        .cyber-title {
+            font-family: 'Press Start 2P', cursive;
+            text-transform: uppercase;
+            letter-spacing: 2px;
+            animation: glitch 1s linear infinite;
+        }
+        .cyber-subtitle {
+            font-family: 'Comic Neue', cursive;
+            letter-spacing: 1px;
+        }
+        @keyframes glitch {
+            0%, 100% { text-shadow: 0.05em 0 0 #00fffc, -0.05em -0.025em 0 #fc00ff; }
+            14% { text-shadow: 0.05em 0 0 #00fffc, -0.05em -0.025em 0 #fc00ff; }
+            15% { text-shadow: -0.05em 0 0 #00fffc, 0.025em 0.025em 0 #fc00ff; }
+            49% { text-shadow: -0.05em 0 0 #00fffc, 0.025em 0.025em 0 #fc00ff; }
+            50% { text-shadow: 0.025em 0 0 #00fffc, 0.05em 0.025em 0 #fc00ff; }
+            99% { text-shadow: 0.025em 0 0 #00fffc, 0.05em 0.025em 0 #fc00ff; }
+        }
+        .cyber-input {
+            background: rgba(0, 0, 0, 0.7);
+            border: 2px solid #0f0;
+            color: #0f0;
+            font-family: 'VT323', monospace;
+            font-size: 1.5rem;
+            box-shadow: 0 0 10px #0f0;
+        }
+        .cyber-input::placeholder {
+            color: rgba(0, 255, 0, 0.5);
+        }
+        .cyber-button {
+            background: linear-gradient(45deg, #ff00ff, #00ffff);
+            color: black;
+            font-family: 'Press Start 2P', cursive;
+            font-size: 0.8rem;
+            border: none;
+            box-shadow: 0 0 15px #ff00ff;
+            position: relative;
+            overflow: hidden;
+            transition: all 0.3s;
+        }
+        .cyber-button:hover {
+            transform: scale(1.05);
+            box-shadow: 0 0 25px #00ffff;
+        }
+        .cyber-button::before {
+            content: '';
+            position: absolute;
+            top: -50%;
+            left: -50%;
+            width: 200%;
+            height: 200%;
+            background: linear-gradient(
+                to bottom right,
+                rgba(255, 255, 255, 0.3) 0%,
+                rgba(255, 255, 255, 0) 60%
+            );
+            transform: rotate(30deg);
+            animation: shine 3s infinite;
+        }
+        @keyframes shine {
+            0% { transform: translateX(-100%) rotate(30deg); }
+            20% { transform: translateX(100%) rotate(30deg); }
+            100% { transform: translateX(100%) rotate(30deg); }
+        }
+        .nft-card {
+            background: rgba(0, 0, 0, 0.7);
+            border: 2px solid #ff00ff;
+            box-shadow: 0 0 15px #ff00ff;
+            transition: all 0.3s;
+            position: relative;
+            overflow: hidden;
+        }
+        .nft-card:hover {
+            transform: translateY(-5px) rotate(1deg);
+            box-shadow: 0 0 25px #00ffff;
+            border-color: #00ffff;
+        }
+        .nft-card::after {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            background: linear-gradient(
+                135deg,
+                rgba(255, 0, 255, 0.1) 0%,
+                rgba(0, 255, 255, 0.1) 100%
+            );
+            pointer-events: none;
+        }
+        .stats-box {
+            background: rgba(0, 0, 0, 0.7);
+            border: 2px solid #0f0;
+            box-shadow: 0 0 10px #0f0;
+        }
+        .stats-title {
+            color: #ff00ff;
+            text-shadow: 0 0 5px #ff00ff;
+        }
+        .stats-value {
+            color: #00ffff;
+            text-shadow: 0 0 5px #00ffff;
+            font-family: 'Press Start 2P', cursive;
+        }
+        .toast {
+            background: linear-gradient(45deg, #ff00ff, #00ffff);
+            color: black;
+            font-family: 'Press Start 2P', cursive;
+            font-size: 0.8rem;
+            border: 2px solid black;
+            box-shadow: 0 0 20px #0f0;
+        }
+        .selected-count {
+            background: linear-gradient(45deg, #ff00ff, #00ffff);
+            color: black;
+            font-family: 'Press Start 2P', cursive;
+            font-size: 0.7rem;
+            border: 2px solid black;
+            box-shadow: 0 0 15px #0f0;
+        }
+        .scanning-text {
+            animation: colorPulse 2s infinite;
+        }
+        @keyframes colorPulse {
+            0% { color: #0f0; }
+            50% { color: #0ff; }
+            100% { color: #0f0; }
+        }
+        .loading-spinner {
+            border: 4px solid rgba(0, 255, 255, 0.3);
+            border-top: 4px solid #0f0;
+            border-radius: 50%;
+            width: 40px;
+            height: 40px;
+            animation: spin 1s linear infinite;
+        }
+        @keyframes spin {
+            0% { transform: rotate(0deg); }
+            100% { transform: rotate(360deg); }
+        }
+        .grid-bg {
+            background-image:
+                linear-gradient(rgba(0, 255, 255, 0.1) 1px, transparent 1px),
+                linear-gradient(90deg, rgba(0, 255, 255, 0.1) 1px, transparent 1px);
+            background-size: 20px 20px;
+        }
+        .cyber-checkbox {
+            appearance: none;
+            width: 20px;
+            height: 20px;
+            border: 2px solid #0f0;
+            background: rgba(0, 0, 0, 0.7);
+            box-shadow: 0 0 5px #0f0;
+            position: relative;
+            cursor: pointer;
+        }
+        .cyber-checkbox:checked {
+            background: #0f0;
+        }
+        .cyber-checkbox:checked::after {
+            content: '✓';
+            position: absolute;
+            color: black;
+            font-size: 1rem;
+            top: -2px;
+            left: 2px;
+        }
+        .footer {
+            border-top: 2px solid #0f0;
+            box-shadow: 0 0 20px #0f0;
+        }
+        .social-icon {
+            transition: all 0.3s;
+        }
+        .social-icon:hover {
+            transform: scale(1.2);
+            color: #ff00ff !important;
+            text-shadow: 0 0 10px #ff00ff;
+        }
+        .pixel-corners {
+            clip-path:
+                polygon(
+                    0% 5px, 5px 5px, 5px 0%, calc(100% - 5px) 0%,
+                    calc(100% - 5px) 5px, 100% 5px, 100% calc(100% - 5px),
+                    calc(100% - 5px) calc(100% - 5px), calc(100% - 5px) 100%,
+                    5px 100%, 5px calc(100% - 5px), 0% calc(100% - 5px)
+                );
+        }
+    </style>
+</head>
+<body class="min-h-screen grid-bg">
+    <!-- Toast notification -->
+    <div id="toast" class="toast fixed bottom-4 right-4 p-3 rounded-sm hidden z-50 pixel-corners">
+        <div class="flex items-center gap-2">
+            <i class="fas fa-check-circle"></i>
+            <span id="toastMessage">Operation completed successfully!</span>
+        </div>
+    </div>
+    <!-- Selected count badge -->
+    <div id="selectedCountBadge" class="selected-count fixed bottom-20 right-4 px-3 py-1 rounded-sm hidden z-50 pixel-corners">
+        <span id="selectedCount">0</span> SELECTED
+    </div>
+    <div class="container mx-auto px-4 py-12">
+        <div class="max-w-4xl mx-auto text-center mb-16">
+            <h1 class="cyber-title text-4xl md:text-6xl mb-6">
+                <span class="text-[#ff00ff]">🌀</span> SOLANA IMAGE VORTEX <span class="text-[#00ffff]">🌀</span>
+            </h1>
+            <p class="cyber-subtitle text-xl md:text-2xl mb-8">
+                DOWNLOAD PSYCHEDELIC NFT IMAGES FROM ANY SOLANA WALLET
+            </p>
+            <div class="max-w-2xl mx-auto p-6 bg-black bg-opacity-70 border-2 border-[#0f0] rounded-sm shadow-lg shadow-[#0f0] mb-12 pixel-corners">
+                <div class="flex flex-col md:flex-row gap-4">
+                    <input
+                        type="text"
+                        id="walletAddress"
+                        placeholder="ENTER SOLANA WALLET ADDRESS..."
+                        class="cyber-input flex-grow px-4 py-3 rounded-sm"
+                    >
+                    <button
+                        id="fetchBtn"
+                        class="cyber-button px-6 py-3 font-semibold rounded-sm hover:bg-opacity-90 transition-all duration-300 flex items-center justify-center gap-2 pixel-corners"
+                    >
+                        <i class="fas fa-cloud-download-alt"></i> FETCH
+                    </button>
+                </div>
+                <div class="mt-4 text-left text-sm text-[#0f0]">
+                    <p>EXAMPLE WALLET: 6zsuBDfivMcPUP5mmQv26GkET9gZV5Qw5E5ZJ2N5F2Gd</p>
+                </div>
+            </div>
+        </div>
+        <div id="loading" class="hidden text-center py-12">
+            <div class="loading-spinner mx-auto mb-6"></div>
+            <p class="scanning-text text-2xl">SCANNING WALLET FOR IMAGES...</p>
+        </div>
+        <div id="stats" class="hidden mb-12">
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
+                <div class="stats-box p-6 text-center pixel-corners">
+                    <p class="stats-title text-lg mb-2">TOTAL NFTS FOUND</p>
+                    <p id="totalNfts" class="stats-value text-3xl">0</p>
+                </div>
+                <div class="stats-box p-6 text-center pixel-corners">
+                    <p class="stats-title text-lg mb-2">IMAGES FOUND</p>
+                    <p id="imageCount" class="stats-value text-3xl">0</p>
+                </div>
+                <div class="stats-box p-6 text-center pixel-corners">
+                    <p class="stats-title text-lg mb-2">SELECTED</p>
+                    <p id="selectedCountStat" class="stats-value text-3xl">0</p>
+                </div>
+            </div>
+        </div>
+        <div id="results" class="hidden">
+            <div class="flex flex-col sm:flex-row justify-between items-start sm:items-center mb-8 gap-4">
+                <h2 class="cyber-title text-3xl text-[#ff00ff]">FOUND IMAGES</h2>
+                <div class="flex flex-wrap gap-3 w-full sm:w-auto">
+                    <button
+                        id="selectAllBtn"
+                        class="cyber-button px-4 py-2 font-semibold rounded-sm flex items-center gap-2 pixel-corners"
+                    >
+                        <i class="fas fa-check-square"></i> SELECT ALL
+                    </button>
+                    <button
+                        id="deselectAllBtn"
+                        class="cyber-button px-4 py-2 font-semibold rounded-sm flex items-center gap-2 pixel-corners"
+                    >
+                        <i class="far fa-square"></i> DESELECT ALL
+                    </button>
+                    <button
+                        id="downloadSelectedBtn"
+                        class="cyber-button px-4 py-2 font-semibold rounded-sm flex items-center gap-2 pixel-corners"
+                    >
+                        <i class="fas fa-download"></i> DOWNLOAD
+                    </button>
+                    <button
+                        id="zipSelectedBtn"
+                        class="cyber-button px-4 py-2 font-semibold rounded-sm flex items-center gap-2 pixel-corners"
+                    >
+                        <i class="fas fa-file-archive"></i> CREATE ZIP
+                    </button>
+                </div>
+            </div>
+            <div id="nftGrid" class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
+                <!-- NFT cards will be inserted here -->
+            </div>
+        </div>
+        <div id="error" class="hidden bg-black bg-opacity-70 border-l-4 border-[#ff0000] p-4 mb-8 rounded-sm">
+            <div class="flex">
+                <div class="flex-shrink-0 text-[#ff0000] text-2xl">
+                    <i class="fas fa-exclamation-circle"></i>
+                </div>
+                <div class="ml-3">
+                    <p id="errorMessage" class="text-[#ff0000]">ERROR MESSAGE WILL APPEAR HERE</p>
+                </div>
+            </div>
+        </div>
+        <div id="emptyState" class="text-center py-20">
+            <div class="mx-auto w-24 h-24 bg-black bg-opacity-70 rounded-full flex items-center justify-center mb-6 border-2 border-[#0f0]">
+                <i class="fas fa-wallet text-[#0f0] text-4xl"></i>
+            </div>
+            <h3 class="text-2xl font-medium text-[#0f0] mb-4">NO WALLET SCANNED YET</h3>
+            <p class="text-[#0f0] max-w-md mx-auto">
+                ENTER A SOLANA WALLET ADDRESS ABOVE TO FIND AND DOWNLOAD ALL IMAGES FROM NFTS IN THAT WALLET.
+            </p>
+        </div>
+    </div>
+    <footer class="footer bg-black bg-opacity-70 py-8 px-4 mt-12">
+        <div class="max-w-6xl mx-auto">
+            <div class="flex flex-col md:flex-row justify-between items-center">
+                <div class="mb-4 md:mb-0">
+                    <p class="text-[#0f0]">🌀 SOLANA IMAGE VORTEX © 2023</p>
+                </div>
+                <div class="flex space-x-6">
+                    <a href="#" class="social-icon text-[#0f0] text-xl">
+                        <i class="fab fa-twitter"></i>
+                    </a>
+                    <a href="#" class="social-icon text-[#0f0] text-xl">
+                        <i class="fab fa-github"></i>
+                    </a>
+                    <a href="#" class="social-icon text-[#0f0] text-xl">
+                        <i class="fab fa-discord"></i>
+                    </a>
+                </div>
+            </div>
+            <div class="mt-8 text-center text-sm text-[#0f0]">
+                <p>THIS TOOL USES THE HELIUS API TO FETCH NFT DATA FROM SOLANA WALLETS. ALL IMAGES REMAIN PROPERTY OF THEIR RESPECTIVE OWNERS.</p>
+            </div>
+        </div>
+    </footer>
+    <!-- JSZip library for ZIP download functionality -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>
+    <script>
+        document.addEventListener('DOMContentLoaded', function() {
+            const walletAddress = document.getElementById('walletAddress');
+            const fetchBtn = document.getElementById('fetchBtn');
+            const loading = document.getElementById('loading');
+            const stats = document.getElementById('stats');
+            const results = document.getElementById('results');
+            const error = document.getElementById('error');
+            const errorMessage = document.getElementById('errorMessage');
+            const emptyState = document.getElementById('emptyState');
+            const nftGrid = document.getElementById('nftGrid');
+            const totalNfts = document.getElementById('totalNfts');
+            const imageCount = document.getElementById('imageCount');
+            const selectedCountStat = document.getElementById('selectedCountStat');
+            const selectAllBtn = document.getElementById('selectAllBtn');
+            const deselectAllBtn = document.getElementById('deselectAllBtn');
+            const downloadSelectedBtn = document.getElementById('downloadSelectedBtn');
+            const zipSelectedBtn = document.getElementById('zipSelectedBtn');
+            const selectedCountBadge = document.getElementById('selectedCountBadge');
+            const selectedCount = document.getElementById('selectedCount');
+            const toast = document.getElementById('toast');
+            const toastMessage = document.getElementById('toastMessage');
+            // Your Helius API key
+            const HELIUS_API_KEY = 'dd4bdaf8-8a81-4f62-b2ec-27ede0bcbd97';
+            let nfts = [];
+            let imagesToDownload = [];
+            let selectedNFTs = [];
+            // Show toast notification
+            function showToast(message, isSuccess = true) {
+                toastMessage.textContent = message;
+                if (isSuccess) {
+                    toast.className = 'toast fixed bottom-4 right-4 p-3 rounded-sm flex items-center gap-2 z-50 pixel-corners';
+                    toast.style.background = 'linear-gradient(45deg, #ff00ff, #00ffff)';
+                } else {
+                    toast.className = 'toast fixed bottom-4 right-4 p-3 rounded-sm flex items-center gap-2 z-50 pixel-corners';
+                    toast.style.background = 'linear-gradient(45deg, #ff0000, #ff6600)';
+                }
+                toast.classList.remove('hidden');
+                setTimeout(() => {
+                    toast.classList.add('hidden');
+                }, 3000);
+            }
+            // Update selected count display
+            function updateSelectedCount() {
+                selectedCount.textContent = selectedNFTs.length;
+                selectedCountStat.textContent = selectedNFTs.length;
+                if (selectedNFTs.length > 0) {
+                    selectedCountBadge.classList.remove('hidden');
+                } else {
+                    selectedCountBadge.classList.add('hidden');
+                }
+            }
+            // Validate Solana wallet address
+            function isValidSolanaAddress(address) {
+                return /^[1-9A-HJ-NP-Za-km-z]{32,44}$/.test(address);
+            }
+            // Fetch NFTs from wallet using Helius API
+            async function fetchNFTs(address) {
+                try {
+                    // Show loading state
+                    loading.classList.remove('hidden');
+                    error.classList.add('hidden');
+                    emptyState.classList.add('hidden');
+                    results.classList.add('hidden');
+                    stats.classList.add('hidden');
+                    // Reset previous data
+                    nfts = [];
+                    imagesToDownload = [];
+                    selectedNFTs = [];
+                    nftGrid.innerHTML = '';
+                    updateSelectedCount();
+                    // Using Helius API to fetch NFTs
+                    const response = await fetch(`https://mainnet.helius-rpc.com/?api-key=${HELIUS_API_KEY}`, {
+                        method: 'POST',
+                        headers: {
+                            'Content-Type': 'application/json',
+                        },
+                        body: JSON.stringify({
+                            jsonrpc: '2.0',
+                            id: '1',
+                            method: 'getAssetsByOwner',
+                            params: {
+                                ownerAddress: address,
+                                page: 1,
+                                limit: 1000
+                            }
+                        })
+                    });
+                    const data = await response.json();
+                    if (data.error) {
+                        throw new Error(data.error.message || 'FAILED TO FETCH NFTS');
+                    }
+                    if (!data.result || !data.result.items || data.result.items.length === 0) {
+                        throw new Error('NO NFTS FOUND IN THIS WALLET');
+                    }
+                    nfts = data.result.items;
+                    totalNfts.textContent = nfts.length;
+                    // Filter NFTs with images
+                    imagesToDownload = nfts.filter(nft => {
+                        return nft.content && nft.content.links && nft.content.links.image;
+                    });
+                    imageCount.textContent = imagesToDownload.length;
+                    if (imagesToDownload.length === 0) {
+                        throw new Error('NO IMAGES FOUND IN NFTS FROM THIS WALLET');
+                    }
+                    // Display NFTs
+                    displayNFTs(imagesToDownload);
+                    // Show results
+                    loading.classList.add('hidden');
+                    stats.classList.remove('hidden');
+                    results.classList.remove('hidden');
+                    showToast(`FOUND ${imagesToDownload.length} IMAGES IN WALLET`);
+                } catch (err) {
+                    console.error('Error fetching NFTs:', err);
+                    loading.classList.add('hidden');
+                    error.classList.remove('hidden');
+                    errorMessage.textContent = err.message.toUpperCase();
+                    emptyState.classList.remove('hidden');
+                    showToast(err.message.toUpperCase(), false);
+                }
+            }
+            // Display NFTs in grid
+            function displayNFTs(nfts) {
+                nftGrid.innerHTML = '';
+                nfts.forEach((nft, index) => {
+                    const imageUrl = nft.content.links.image;
+                    const name = nft.content.metadata.name || 'UNNAMED NFT';
+                    const collection = nft.grouping && nft.grouping.length > 0 ? nft.grouping[0].group_value : 'NO COLLECTION';
+                    const nftCard = document.createElement('div');
+                    nftCard.className = 'nft-card p-0 overflow-hidden relative pixel-corners';
+                    nftCard.innerHTML = `
+                        <div class="absolute top-2 left-2 z-10">
+                            <input
+                                type="checkbox"
+                                class="cyber-checkbox"
+                                data-index="${index}"
+                                data-url="${imageUrl}"
+                                data-name="${name.replace(/[^a-z0-9]/gi, '_').toLowerCase()}"
+                            >
+                        </div>
+                        <div class="relative pb-[100%]">
+                            <img src="${imageUrl}" alt="${name}" class="absolute h-full w-full object-cover" loading="lazy" onerror="this.src='https://via.placeholder.com/400?text=IMAGE+NOT+AVAILABLE'">
+                        </div>
+                        <div class="p-4">
+                            <h3 class="font-bold text-lg text-[#0f0] truncate">${name.toUpperCase()}</h3>
+                            <p class="text-sm text-[#0ff] truncate">${collection.toUpperCase()}</p>
+                            <div class="mt-2 flex justify-between items-center">
+                                <span class="text-xs text-[#0f0]">#${index + 1}</span>
+                                <button
+                                    class="download-single-btn px-3 py-1 bg-black bg-opacity-70 text-[#0f0] text-xs rounded-sm hover:bg-[#0f0] hover:text-black transition-colors duration-200 border border-[#0f0] pixel-corners"
+                                    data-url="${imageUrl}"
+                                    data-name="${name.replace(/[^a-z0-9]/gi, '_').toLowerCase()}"
+                                >
+                                    <i class="fas fa-download"></i> GRAB
+                                </button>
+                            </div>
+                        </div>
+                    `;
+                    nftGrid.appendChild(nftCard);
+                });
+                // Add event listeners to checkboxes
+                document.querySelectorAll('.cyber-checkbox').forEach(checkbox => {
+                    checkbox.addEventListener('change', function() {
+                        const index = parseInt(this.getAttribute('data-index'));
+                        const nft = imagesToDownload[index];
+                        if (this.checked) {
+                            selectedNFTs.push({
+                                ...nft,
+                                checkbox: this
+                            });
+                        } else {
+                            selectedNFTs = selectedNFTs.filter(item => item.content.links.image !== nft.content.links.image);
+                        }
+                        updateSelectedCount();
+                    });
+                });
+                // Add event listeners to single download buttons
+                document.querySelectorAll('.download-single-btn').forEach(btn => {
+                    btn.addEventListener('click', function() {
+                        const url = this.getAttribute('data-url');
+                        const name = this.getAttribute('data-name');
+                        downloadImage(url, name);
+                    });
+                });
+            }
+            // Download a single image
+            function downloadImage(url, name) {
+                fetch(url)
+                    .then(response => response.blob())
+                    .then(blob => {
+                        const a = document.createElement('a');
+                        a.href = URL.createObjectURL(blob);
+                        a.download = `${name || 'nft'}_${Date.now()}.${blob.type.split('/')[1] || 'jpg'}`;
+                        document.body.appendChild(a);
+                        a.click();
+                        document.body.removeChild(a);
+                        showToast('IMAGE DOWNLOADED SUCCESSFULLY!');
+                    })
+                    .catch(err => {
+                        console.error('Error downloading image:', err);
+                        showToast('FAILED TO DOWNLOAD IMAGE', false);
+                    });
+            }
+            // Select all NFTs
+            function selectAllNFTs() {
+                document.querySelectorAll('.cyber-checkbox').forEach(checkbox => {
+                    checkbox.checked = true;
+                });
+                selectedNFTs = imagesToDownload.map((nft, index) => ({
+                    ...nft,
+                    checkbox: document.querySelector(`.cyber-checkbox[data-index="${index}"]`)
+                }));
+                updateSelectedCount();
+                showToast(`SELECTED ALL ${imagesToDownload.length} IMAGES`);
+            }
+            // Deselect all NFTs
+            function deselectAllNFTs() {
+                document.querySelectorAll('.cyber-checkbox').forEach(checkbox => {
+                    checkbox.checked = false;
+                });
+                selectedNFTs = [];
+                updateSelectedCount();
+                showToast('DESELECTED ALL IMAGES');
+            }
+            // Download selected images
+            async function downloadSelectedImages() {
+                if (selectedNFTs.length === 0) {
+                    showToast('PLEASE SELECT AT LEAST ONE IMAGE TO DOWNLOAD', false);
+                    return;
+                }
+                downloadSelectedBtn.disabled = true;
+                downloadSelectedBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> DOWNLOADING...';
+                let downloadedCount = 0;
+                const totalCount = selectedNFTs.length;
+                // Download images sequentially to avoid browser limitations
+                for (let i = 0; i < selectedNFTs.length; i++) {
+                    const nft = selectedNFTs[i];
+                    const imageUrl = nft.content.links.image;
+                    const name = nft.content.metadata.name || 'unnamed_nft';
+                    try {
+                        await new Promise((resolve) => {
+                            fetch(imageUrl)
+                                .then(response => response.blob())
+                                .then(blob => {
+                                    const a = document.createElement('a');
+                                    a.href = URL.createObjectURL(blob);
+                                    a.download = `${name.replace(/[^a-z0-9]/gi, '_').toLowerCase()}_${i}.${blob.type.split('/')[1] || 'jpg'}`;
+                                    document.body.appendChild(a);
+                                    a.click();
+                                    document.body.removeChild(a);
+                                    downloadedCount++;
+                                    resolve();
+                                })
+                                .catch(err => {
+                                    console.error('Error downloading image:', err);
+                                    resolve(); // Continue with next image even if one fails
+                                });
+                        });
+                        // Small delay between downloads
+                        await new Promise(resolve => setTimeout(resolve, 300));
+                    } catch (err) {
+                        console.error('Error in download sequence:', err);
+                    }
+                }
+                downloadSelectedBtn.disabled = false;
+                downloadSelectedBtn.innerHTML = '<i class="fas fa-download"></i> DOWNLOAD';
+                showToast(`DOWNLOAD COMPLETED! ${downloadedCount} IMAGES SAVED.`);
+            }
+            // Download selected images as a ZIP file
+            async function downloadSelectedAsZip() {
+                if (selectedNFTs.length === 0) {
+                    showToast('PLEASE SELECT AT LEAST ONE IMAGE TO DOWNLOAD', false);
+                    return;
+                }
+                zipSelectedBtn.disabled = true;
+                zipSelectedBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> CREATING ZIP...';
+                const zip = new JSZip();
+                const imgFolder = zip.folder("selected_nft_images");
+                let processedCount = 0;
+                const totalCount = selectedNFTs.length;
+                // Process images for ZIP
+                for (let i = 0; i < selectedNFTs.length; i++) {
+                    const nft = selectedNFTs[i];
+                    const imageUrl = nft.content.links.image;
+                    const name = nft.content.metadata.name || 'unnamed_nft';
+                    const extension = imageUrl.split('.').pop().split('?')[0] || 'jpg';
+                    try {
+                        const response = await fetch(imageUrl);
+                        const blob = await response.blob();
+                        imgFolder.file(`${name.replace(/[^a-z0-9]/gi, '_').toLowerCase()}_${i}.${extension}`, blob);
+                        processedCount++;
+                    } catch (err) {
+                        console.error('Error processing image for ZIP:', err);
+                    }
+                }
+                // Generate and download the ZIP file
+                zip.generateAsync({ type: 'blob' }).then(function(content) {
+                    saveAs(content, "selected_nft_images.zip");
+                    zipSelectedBtn.disabled = false;
+                    zipSelectedBtn.innerHTML = '<i class="fas fa-file-archive"></i> CREATE ZIP';
+                    showToast('ZIP FILE DOWNLOADED SUCCESSFULLY!');
+                });
+            }
+            // Event listeners
+            fetchBtn.addEventListener('click', function() {
+                if (!walletAddress.value.trim()) {
+                    error.classList.remove('hidden');
+                    errorMessage.textContent = 'PLEASE ENTER A WALLET ADDRESS';
+                    showToast('PLEASE ENTER A WALLET ADDRESS', false);
+                    return;
+                }
+                if (!isValidSolanaAddress(walletAddress.value.trim())) {
+                    error.classList.remove('hidden');
+                    errorMessage.textContent = 'PLEASE ENTER A VALID SOLANA WALLET ADDRESS';
+                    showToast('INVALID SOLANA WALLET ADDRESS', false);
+                    return;
+                }
+                fetchNFTs(walletAddress.value.trim());
+            });
+            selectAllBtn.addEventListener('click', selectAllNFTs);
+            deselectAllBtn.addEventListener('click', deselectAllNFTs);
+            downloadSelectedBtn.addEventListener('click', downloadSelectedImages);
+            zipSelectedBtn.addEventListener('click', downloadSelectedAsZip);
+            // Example wallet address for demo purposes
+            walletAddress.addEventListener('focus', function() {
+                if (!this.value) {
+                    this.value = '6zsuBDfivMcPUP5mmQv26GkET9gZV5Qw5E5ZJ2N5F2Gd';
+                }
+            });
+        });
+    </script>
+<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=nock2/solana-nft-gripper" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>

prompts.txt ADDED Viewed

	@@ -0,0 +1 @@


1	+ Make the app look stylish. Think psychedelic web1 vibes with crazy fonts