Hugging Face's logo

Spaces:
privateuserh
/
privdmi1
Running

App Files Community
privateuserh commited on
Commit
acf770a
·
verified ·
1 Parent(s): ff0459c

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +652 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Privdmi1
3
- emoji: 🐠
4
- colorFrom: gray
5
- colorTo: red
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: privdmi1
3
+ emoji: 🐳
4
+ colorFrom: yellow
5
+ colorTo: yellow
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,652 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
6
+ <title>DMIM - Trend Explorer</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ /* Custom scrollbar */
11
+ ::-webkit-scrollbar {
12
+ width: 4px;
13
+ }
14
+ ::-webkit-scrollbar-track {
15
+ background: #f1f1f1;
16
+ }
17
+ ::-webkit-scrollbar-thumb {
18
+ background: #4a6fdc;
19
+ border-radius: 3px;
20
+ }
21
+ ::-webkit-scrollbar-thumb:hover {
22
+ background: #3a5bc7;
23
+ }
24
+
25
+ /* Card hover effect */
26
+ .trend-card:hover {
27
+ transform: translateY(-2px);
28
+ }
29
+
30
+ /* DMIM token color */
31
+ .dmim-bg { background-color: #4a6fdc; }
32
+
33
+ /* Prevent text selection */
34
+ * {
35
+ -webkit-user-select: none;
36
+ -moz-user-select: none;
37
+ -ms-user-select: none;
38
+ user-select: none;
39
+ }
40
+ </style>
41
+ </head>
42
+ <body class="bg-gray-50 font-sans text-gray-800">
43
+ <!-- App Container -->
44
+ <div class="max-w-md mx-auto bg-white min-h-screen flex flex-col">
45
+ <!-- Header -->
46
+ <header class="dmim-bg p-4 shadow-sm">
47
+ <div class="flex items-center justify-between">
48
+ <h1 class="text-white text-xl font-bold">DMIM</h1>
49
+ <button class="text-white" id="dmimBalanceBtn">
50
+ <span id="dmimBalanceDisplay">0 DMIM</span>
51
+ </button>
52
+ </div>
53
+ </header>
54
+
55
+ <!-- Main Content Area -->
56
+ <main class="flex-1 overflow-y-auto p-4" id="mainContent">
57
+ <!-- Home Tab Content -->
58
+ <div id="homeTab">
59
+ <div class="mb-6">
60
+ <h2 class="text-lg font-semibold mb-4">Trending Now</h2>
61
+
62
+ <div class="grid grid-cols-1 gap-4" id="trendingCardsContainer">
63
+ <!-- Cards will be dynamically inserted here -->
64
+ </div>
65
+ </div>
66
+
67
+ <div class="mt-6">
68
+ <h2 class="text-lg font-semibold mb-4">Your Saved Trends</h2>
69
+ <div class="space-y-3" id="savedTrendsContainer">
70
+ <!-- Saved trends will appear here -->
71
+ </div>
72
+ </div>
73
+ </div>
74
+
75
+ <!-- Search Tab Content (hidden by default) -->
76
+ <div id="searchTab" class="hidden">
77
+ <div class="mb-4">
78
+ <div class="relative">
79
+ <input type="text" id="trendSearchInput" placeholder="Search for trends..."
80
+ class="w-full py-3 px-4 rounded-lg bg-gray-100 focus:outline-none focus:ring-2 focus:ring-dmim-bg">
81
+ <button id="searchTrendBtn" class="absolute right-3 top-3 text-gray-500 hover:text-dmim-bg">
82
+ <i class="fas fa-search"></i>
83
+ </button>
84
+ </div>
85
+ </div>
86
+
87
+ <div class="grid grid-cols-1 gap-4" id="searchResultsContainer">
88
+ <!-- Search results will appear here -->
89
+ </div>
90
+ </div>
91
+ </main>
92
+
93
+ <!-- Bottom Navigation -->
94
+ <nav class="bg-white border-t border-gray-200 p-2">
95
+ <div class="flex justify-around">
96
+ <button class="tab-button active flex flex-col items-center text-dmim-bg" data-tab="homeTab">
97
+ <i class="fas fa-home text-lg"></i>
98
+ <span class="text-xs mt-1">Home</span>
99
+ </button>
100
+
101
+ <button class="tab-button flex flex-col items-center text-gray-500" data-tab="searchTab">
102
+ <i class="fas fa-search text-lg"></i>
103
+ <span class="text-xs mt-1">Search</span>
104
+ </button>
105
+
106
+ <button class="flex flex-col items-center text-gray-500" id="addTrendBtn">
107
+ <i class="fas fa-plus-circle text-lg"></i>
108
+ <span class="text-xs mt-1">Add</span>
109
+ </button>
110
+ </div>
111
+ </nav>
112
+
113
+ <!-- Add Trend Modal (hidden by default) -->
114
+ <div id="addTrendModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
115
+ <div class="bg-white rounded-lg w-full max-w-md mx-4">
116
+ <div class="p-4 border-b border-gray-200">
117
+ <h3 class="font-semibold text-lg">Add New Trend</h3>
118
+ </div>
119
+
120
+ <div class="p-4">
121
+ <div class="mb-4">
122
+ <label class="block text-sm font-medium text-gray-700 mb-1">Hashtag</label>
123
+ <input type="text" id="newHashtag" placeholder="#trend"
124
+ class="w-full py-2 px-4 rounded-lg bg-gray-100 focus:outline-none focus:ring-2 focus:ring-dmim-bg">
125
+ </div>
126
+
127
+ <div class="mb-4">
128
+ <label class="block text-sm font-medium text-gray-700 mb-1">Platform</label>
129
+ <div class="grid grid-cols-2 gap-2">
130
+ <button class="platform-btn bg-gray-200 text-gray-700 py-2 px-3 rounded text-sm" data-platform="twitter">
131
+ <i class="fab fa-twitter mr-1 text-blue-400"></i> Twitter
132
+ </button>
133
+ <button class="platform-btn bg-gray-200 text-gray-700 py-2 px-3 rounded text-sm" data-platform="tiktok">
134
+ <i class="fab fa-tiktok mr-1"></i> TikTok
135
+ </button>
136
+ <button class="platform-btn bg-gray-200 text-gray-700 py-2 px-3 rounded text-sm" data-platform="instagram">
137
+ <i class="fab fa-instagram mr-1 text-pink-500"></i> Instagram
138
+ </button>
139
+ <button class="platform-btn bg-gray-200 text-gray-700 py-2 px-3 rounded text-sm" data-platform="youtube">
140
+ <i class="fab fa-youtube mr-1 text-red-500"></i> YouTube
141
+ </button>
142
+ </div>
143
+ </div>
144
+ </div>
145
+
146
+ <div class="p-4 border-t border-gray-200 flex justify-end space-x-3">
147
+ <button id="cancelAddTrend" class="px-4 py-2 border border-gray-300 rounded-md text-sm font-medium text-gray-700">
148
+ Cancel
149
+ </button>
150
+ <button id="saveTrend" class="px-4 py-2 dmim-bg text-white rounded-md text-sm font-medium">
151
+ Save Trend
152
+ </button>
153
+ </div>
154
+ </div>
155
+ </div>
156
+
157
+ <!-- DMIM Token Modal (hidden by default) -->
158
+ <div id="dmimModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
159
+ <div class="bg-white rounded-lg w-full max-w-md mx-4">
160
+ <div class="p-4 border-b border-gray-200 flex justify-between items-center">
161
+ <h3 class="font-semibold text-lg">DMIM Token</h3>
162
+ <span class="inline-flex items-center bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">
163
+ <i class="fas fa-check-circle mr-1"></i> Verified
164
+ </span>
165
+ </div>
166
+
167
+ <div class="p-4">
168
+ <div class="flex items-center mb-4">
169
+ <div class="w-12 h-12 rounded-full dmim-bg text-white flex items-center justify-center mr-3">
170
+ <i class="fas fa-coins text-xl"></i>
171
+ </div>
172
+ <div>
173
+ <h4 class="font-medium">Bitcoin Cash CHIP Protocol</h4>
174
+ <p class="text-sm text-gray-500">0.3% APY Yield Farming</p>
175
+ </div>
176
+ </div>
177
+
178
+ <div class="mb-4">
179
+ <p class="text-sm text-gray-700 mb-3">
180
+ DMIM is a private cryptocurrency token on the Bitcoin Cash network using the CHIP protocol.
181
+ Stake DMIM to your saved trends to earn yield.
182
+ </p>
183
+
184
+ <div class="space-y-2">
185
+ <a href="https://tokenexplorer.cash/?tokenId=81fd176d7e3769aad00bc21539082cc3345f9cd613623fa281e6726f451f32f9" target="_blank" class="flex items-center text-blue-500 text-sm">
186
+ <i class="fas fa-external-link-alt mr-2"></i> View on Token Explorer
187
+ </a>
188
+ <a href="https://app.cauldron.quest/swap/81fd176d7e3769aad00bc21539082cc3345f9cd613623fa281e6726f451f32f9" target="_blank" class="flex items-center text-blue-500 text-sm">
189
+ <i class="fas fa-exchange-alt mr-2"></i> Swap on Cauldron
190
+ </a>
191
+ <a href="https://blockchair.com/bitcoin-cash/transaction/81fd176d7e3769aad00bc21539082cc3345f9cd613623fa281e6726f451f32f9" target="_blank" class="flex items-center text-blue-500 text-sm">
192
+ <i class="fas fa-link mr-2"></i> View Transaction
193
+ </a>
194
+ </div>
195
+ </div>
196
+
197
+ <div class="bg-gray-100 rounded-lg p-3 mb-4">
198
+ <h4 class="font-medium text-sm mb-2">Your DMIM Balance</h4>
199
+ <div class="flex justify-between items-center">
200
+ <span class="font-medium" id="dmimBalance">0 DMIM</span>
201
+ <button id="addDmimBtn" class="text-sm text-dmim-bg font-medium">
202
+ <i class="fas fa-plus-circle mr-1"></i> Add DMIM
203
+ </button>
204
+ </div>
205
+ </div>
206
+
207
+ <div class="bg-gray-100 rounded-lg p-3">
208
+ <h4 class="font-medium text-sm mb-2">Stake DMIM to Trend</h4>
209
+ <div class="mb-2">
210
+ <select id="trendSelect" class="w-full p-2 rounded border border-gray-300 text-sm">
211
+ <option value="">-- Select a saved trend --</option>
212
+ </select>
213
+ </div>
214
+ <div class="mb-2">
215
+ <input type="number" id="stakeAmount" placeholder="DMIM amount" class="w-full p-2 rounded border border-gray-300 text-sm">
216
+ </div>
217
+ <button id="stakeBtn" class="w-full py-2 dmim-bg text-white rounded-lg text-sm font-medium">
218
+ Stake & Farm Yield
219
+ </button>
220
+ </div>
221
+ </div>
222
+
223
+ <div class="p-4 border-t border-gray-200 flex justify-center">
224
+ <button id="closeDmimModal" class="px-4 py-2 dmim-bg text-white rounded-md text-sm font-medium">
225
+ Close
226
+ </button>
227
+ </div>
228
+ </div>
229
+ </div>
230
+
231
+ <!-- Toast Notification (hidden by default) -->
232
+ <div id="toast" class="fixed bottom-20 left-1/2 transform -translate-x-1/2 bg-gray-800 text-white px-4 py-2 rounded-md shadow-lg hidden z-50">
233
+ <div class="flex items-center">
234
+ <span id="toastMessage">Trend saved successfully</span>
235
+ </div>
236
+ </div>
237
+ </div>
238
+
239
+ <script>
240
+ // Sample data for trending cards
241
+ const trendingData = [
242
+ {
243
+ hashtag: "#Crypto",
244
+ title: "Latest cryptocurrency trends and discussions",
245
+ platform: "twitter",
246
+ posts: "12K",
247
+ popularity: "1.2M"
248
+ },
249
+ {
250
+ hashtag: "#Tech",
251
+ title: "New tech innovations and product launches",
252
+ platform: "twitter",
253
+ posts: "8K",
254
+ popularity: "890K"
255
+ },
256
+ {
257
+ hashtag: "#Gaming",
258
+ title: "Upcoming game releases and esports news",
259
+ platform: "youtube",
260
+ posts: "15K",
261
+ popularity: "750K"
262
+ },
263
+ {
264
+ hashtag: "#Finance",
265
+ title: "Stock market updates and investment tips",
266
+ platform: "twitter",
267
+ posts: "25K",
268
+ popularity: "1.5M"
269
+ }
270
+ ];
271
+
272
+ // User data
273
+ let userData = {
274
+ dmimBalance: 1000,
275
+ savedTrends: [
276
+ {
277
+ hashtag: "#Bitcoin",
278
+ platform: "twitter",
279
+ hasDmim: true,
280
+ stakedAmount: 500
281
+ },
282
+ {
283
+ hashtag: "#DeFi",
284
+ platform: "twitter",
285
+ hasDmim: false,
286
+ stakedAmount: 0
287
+ }
288
+ ]
289
+ };
290
+
291
+ // Function to generate platform icon
292
+ function getPlatformIcon(platform) {
293
+ const icons = {
294
+ twitter: '<i class="fab fa-twitter text-blue-400"></i>',
295
+ tiktok: '<i class="fab fa-tiktok"></i>',
296
+ instagram: '<i class="fab fa-instagram text-pink-500"></i>',
297
+ youtube: '<i class="fab fa-youtube text-red-500"></i>'
298
+ };
299
+ return icons[platform] || '<i class="fas fa-hashtag"></i>';
300
+ }
301
+
302
+ // Function to render trending cards
303
+ function renderTrendingCards() {
304
+ const container = document.getElementById('trendingCardsContainer');
305
+ container.innerHTML = '';
306
+
307
+ trendingData.forEach(item => {
308
+ const card = document.createElement('div');
309
+ card.className = 'trend-card bg-white rounded-lg shadow-sm p-4 h-40 flex flex-col justify-between transition cursor-pointer';
310
+ card.innerHTML = `
311
+ <div class="flex items-start justify-between mb-2">
312
+ <div>
313
+ <span class="inline-flex items-center bg-gray-100 text-gray-800 text-xs px-2 py-1 rounded-full">
314
+ ${getPlatformIcon(item.platform)}
315
+ <span class="ml-1">${item.hashtag}</span>
316
+ </span>
317
+ </div>
318
+ <span class="inline-flex items-center bg-gray-100 text-gray-800 text-xs px-2 py-1 rounded-full">
319
+ <i class="fas fa-fire text-orange-400 mr-1"></i> ${item.popularity}
320
+ </span>
321
+ </div>
322
+ <h3 class="font-medium text-sm line-clamp-3 mb-3">${item.title}</h3>
323
+ <div class="flex justify-between items-center text-xs text-gray-500">
324
+ <span>${item.posts} posts</span>
325
+ <button class="save-trend-btn text-gray-400 hover:text-dmim-bg" data-hashtag="${item.hashtag}" data-platform="${item.platform}">
326
+ <i class="fas fa-bookmark"></i> Save
327
+ </button>
328
+ </div>
329
+ `;
330
+ container.appendChild(card);
331
+ });
332
+
333
+ // Add event listeners to save buttons
334
+ document.querySelectorAll('.save-trend-btn').forEach(btn => {
335
+ btn.addEventListener('click', function(e) {
336
+ e.stopPropagation();
337
+ const hashtag = this.getAttribute('data-hashtag');
338
+ const platform = this.getAttribute('data-platform');
339
+ saveTrend(hashtag, platform);
340
+ });
341
+ });
342
+ }
343
+
344
+ // Function to render saved trends
345
+ function renderSavedTrends() {
346
+ const container = document.getElementById('savedTrendsContainer');
347
+ container.innerHTML = '';
348
+
349
+ // Update select dropdown
350
+ const trendSelect = document.getElementById('trendSelect');
351
+ trendSelect.innerHTML = '<option value="">-- Select a saved trend --</option>';
352
+
353
+ userData.savedTrends.forEach(trend => {
354
+ const element = document.createElement('div');
355
+ element.className = 'flex items-center p-3 rounded-lg bg-white shadow-sm cursor-pointer hover:bg-gray-50';
356
+ element.innerHTML = `
357
+ <div class="flex-shrink-0 mr-3">
358
+ <div class="w-8 h-8 rounded-full flex items-center justify-center text-white ${trend.platform === 'twitter' ? 'bg-blue-400' : trend.platform === 'instagram' ? 'bg-pink-500' : trend.platform === 'youtube' ? 'bg-red-500' : 'bg-black'}">
359
+ ${getPlatformIcon(trend.platform)}
360
+ </div>
361
+ </div>
362
+ <div class="flex-1">
363
+ <div class="flex items-center">
364
+ <h4 class="font-medium text-sm">${trend.hashtag}</h4>
365
+ ${trend.hasDmim ? '<span class="ml-1 text-green-500"><i class="fas fa-check-circle"></i></span>' : ''}
366
+ </div>
367
+ <p class="text-gray-500 text-xs">${trend.platform} • ${trend.hasDmim ? 'Staked: ' + trend.stakedAmount + ' DMIM' : 'Not staked'}</p>
368
+ </div>
369
+ <button class="text-gray-500 hover:text-dmim-bg" data-hashtag="${trend.hashtag}">
370
+ <i class="fas fa-ellipsis-v"></i>
371
+ </button>
372
+ `;
373
+ container.appendChild(element);
374
+
375
+ // Add to select dropdown
376
+ const option = document.createElement('option');
377
+ option.value = trend.hashtag;
378
+ option.textContent = trend.hashtag;
379
+ trendSelect.appendChild(option);
380
+ });
381
+
382
+ // Update DMIM balance display
383
+ document.getElementById('dmimBalance').textContent = userData.dmimBalance + ' DMIM';
384
+ document.getElementById('dmimBalanceDisplay').textContent = userData.dmimBalance + ' DMIM';
385
+ }
386
+
387
+ // Function to show search results
388
+ function showSearchResults(query) {
389
+ const container = document.getElementById('searchResultsContainer');
390
+ container.innerHTML = '';
391
+
392
+ if (!query) return;
393
+
394
+ // Simulate search with timeout
395
+ setTimeout(() => {
396
+ // In a real app, this would fetch actual search results
397
+ const results = [
398
+ {
399
+ hashtag: `#${query}`,
400
+ title: `Latest content about ${query}`,
401
+ platform: "twitter",
402
+ posts: Math.floor(Math.random() * 100) + "K"
403
+ },
404
+ {
405
+ hashtag: `#${query}News`,
406
+ title: `Breaking news about ${query}`,
407
+ platform: "twitter",
408
+ posts: Math.floor(Math.random() * 50) + "K"
409
+ },
410
+ {
411
+ hashtag: `#${query}Trends`,
412
+ title: `Trending topics related to ${query}`,
413
+ platform: "youtube",
414
+ posts: Math.floor(Math.random() * 30) + "K"
415
+ }
416
+ ];
417
+
418
+ results.forEach(item => {
419
+ const card = document.createElement('div');
420
+ card.className = 'trend-card bg-white rounded-lg shadow-sm p-4 h-40 flex flex-col justify-between transition cursor-pointer';
421
+ card.innerHTML = `
422
+ <div class="flex items-start justify-between mb-2">
423
+ <div>
424
+ <span class="inline-flex items-center bg-gray-100 text-gray-800 text-xs px-2 py-1 rounded-full">
425
+ ${getPlatformIcon(item.platform)}
426
+ <span class="ml-1">${item.hashtag}</span>
427
+ </span>
428
+ </div>
429
+ <button class="save-trend-btn text-gray-400 hover:text-dmim-bg" data-hashtag="${item.hashtag}" data-platform="${item.platform}">
430
+ <i class="fas fa-bookmark"></i> Save
431
+ </button>
432
+ </div>
433
+ <h3 class="font-medium text-sm line-clamp-3 mb-3">${item.title}</h3>
434
+ <div class="flex justify-between items-center text-xs text-gray-500">
435
+ <span>${item.posts} posts</span>
436
+ <span>${item.platform}</span>
437
+ </div>
438
+ `;
439
+ container.appendChild(card);
440
+ });
441
+
442
+ // Add event listeners to save buttons
443
+ document.querySelectorAll('.save-trend-btn').forEach(btn => {
444
+ btn.addEventListener('click', function(e) {
445
+ e.stopPropagation();
446
+ const hashtag = this.getAttribute('data-hashtag');
447
+ const platform = this.getAttribute('data-platform');
448
+ saveTrend(hashtag, platform);
449
+ });
450
+ });
451
+
452
+ showToast(`Found results for ${query}`);
453
+ }, 1000);
454
+ }
455
+
456
+ // Function to save a trend
457
+ function saveTrend(hashtag, platform) {
458
+ // Check if already saved
459
+ if (userData.savedTrends.some(t => t.hashtag === hashtag)) {
460
+ showToast('This trend is already saved');
461
+ return;
462
+ }
463
+
464
+ // Add to saved trends
465
+ userData.savedTrends.push({
466
+ hashtag,
467
+ platform,
468
+ hasDmim: false,
469
+ stakedAmount: 0
470
+ });
471
+
472
+ // Update UI
473
+ renderSavedTrends();
474
+ showToast(`${hashtag} saved to your library`);
475
+ }
476
+
477
+ // Function to stake DMIM to a trend
478
+ function stakeDmim(hashtag, amount) {
479
+ if (!hashtag || !amount || amount <= 0) {
480
+ showToast('Please select a trend and enter a valid amount');
481
+ return;
482
+ }
483
+
484
+ if (amount > userData.dmimBalance) {
485
+ showToast('Insufficient DMIM balance');
486
+ return;
487
+ }
488
+
489
+ // Update staked amount
490
+ const trend = userData.savedTrends.find(t => t.hashtag === hashtag);
491
+ if (trend) {
492
+ trend.hasDmim = true;
493
+ trend.stakedAmount = (trend.stakedAmount || 0) + amount;
494
+ userData.dmimBalance -= amount;
495
+ }
496
+
497
+ // Update UI
498
+ renderSavedTrends();
499
+ showToast(`Staked ${amount} DMIM to ${hashtag}`);
500
+ }
501
+
502
+ // Function to add DMIM tokens
503
+ function addDmim(amount) {
504
+ userData.dmimBalance += amount;
505
+ renderSavedTrends();
506
+ showToast(`Added ${amount} DMIM to your balance`);
507
+ }
508
+
509
+ // Initialize the app
510
+ function initApp() {
511
+ renderTrendingCards();
512
+ renderSavedTrends();
513
+ }
514
+
515
+ // Tab switching functionality
516
+ document.querySelectorAll('.tab-button').forEach(button => {
517
+ button.addEventListener('click', function() {
518
+ // Remove active class from all buttons
519
+ document.querySelectorAll('.tab-button').forEach(btn => {
520
+ btn.classList.remove('active', 'text-dmim-bg');
521
+ btn.classList.add('text-gray-500');
522
+ });
523
+
524
+ // Add active class to clicked button
525
+ this.classList.add('active', 'text-dmim-bg');
526
+ this.classList.remove('text-gray-500');
527
+
528
+ // Hide all tabs
529
+ document.querySelectorAll('#mainContent > div').forEach(tab => {
530
+ tab.classList.add('hidden');
531
+ });
532
+
533
+ // Show selected tab
534
+ const tabId = this.getAttribute('data-tab');
535
+ document.getElementById(tabId).classList.remove('hidden');
536
+
537
+ // Scroll to top when switching tabs
538
+ document.getElementById('mainContent').scrollTo(0, 0);
539
+
540
+ // If switching to search tab, focus search input
541
+ if (tabId === 'searchTab') {
542
+ setTimeout(() => {
543
+ document.getElementById('trendSearchInput').focus();
544
+ }, 100);
545
+ }
546
+ });
547
+ });
548
+
549
+ // Search trend functionality
550
+ document.getElementById('searchTrendBtn').addEventListener('click', function() {
551
+ const query = document.getElementById('trendSearchInput').value.trim();
552
+ if (query) {
553
+ showSearchResults(query);
554
+ }
555
+ });
556
+
557
+ document.getElementById('trendSearchInput').addEventListener('keypress', function(e) {
558
+ if (e.key === 'Enter') {
559
+ const query = this.value.trim();
560
+ if (query) {
561
+ showSearchResults(query);
562
+ }
563
+ }
564
+ });
565
+
566
+ // Add trend button
567
+ document.getElementById('addTrendBtn').addEventListener('click', function() {
568
+ document.getElementById('addTrendModal').classList.remove('hidden');
569
+ });
570
+
571
+ // Cancel add trend
572
+ document.getElementById('cancelAddTrend').addEventListener('click', function() {
573
+ document.getElementById('addTrendModal').classList.add('hidden');
574
+ });
575
+
576
+ // Save new trend
577
+ document.getElementById('saveTrend').addEventListener('click', function() {
578
+ const hashtag = document.getElementById('newHashtag').value.trim();
579
+ const platform = document.querySelector('.platform-btn.bg-dmim-bg')?.getAttribute('data-platform');
580
+
581
+ if (!hashtag || !platform) {
582
+ showToast('Please enter a hashtag and select a platform');
583
+ return;
584
+ }
585
+
586
+ // Add to saved trends
587
+ userData.savedTrends.push({
588
+ hashtag,
589
+ platform,
590
+ hasDmim: false,
591
+ stakedAmount: 0
592
+ });
593
+
594
+ // Update UI
595
+ renderSavedTrends();
596
+ document.getElementById('addTrendModal').classList.add('hidden');
597
+ document.getElementById('newHashtag').value = '';
598
+ showToast(`${hashtag} saved to your library`);
599
+ });
600
+
601
+ // Platform selection in add trend modal
602
+ document.querySelectorAll('.platform-btn').forEach(btn => {
603
+ btn.addEventListener('click', function() {
604
+ document.querySelectorAll('.platform-btn').forEach(b => {
605
+ b.classList.remove('bg-dmim-bg', 'text-white');
606
+ b.classList.add('bg-gray-200', 'text-gray-700');
607
+ });
608
+ this.classList.remove('bg-gray-200', 'text-gray-700');
609
+ this.classList.add('bg-dmim-bg', 'text-white');
610
+ });
611
+ });
612
+
613
+ // Stake DMIM button
614
+ document.getElementById('stakeBtn').addEventListener('click', function() {
615
+ const hashtag = document.getElementById('trendSelect').value;
616
+ const amount = parseFloat(document.getElementById('stakeAmount').value);
617
+ stakeDmim(hashtag, amount);
618
+ });
619
+
620
+ // DMIM balance button
621
+ document.getElementById('dmimBalanceBtn').addEventListener('click', function() {
622
+ document.getElementById('dmimModal').classList.remove('hidden');
623
+ });
624
+
625
+ // Close DMIM modal
626
+ document.getElementById('closeDmimModal').addEventListener('click', function() {
627
+ document.getElementById('dmimModal').classList.add('hidden');
628
+ });
629
+
630
+ // Add DMIM button
631
+ document.getElementById('addDmimBtn').addEventListener('click', function() {
632
+ addDmim(1000);
633
+ });
634
+
635
+ // Toast notification function
636
+ function showToast(message) {
637
+ const toast = document.getElementById('toast');
638
+ const toastMessage = document.getElementById('toastMessage');
639
+
640
+ toastMessage.textContent = message;
641
+ toast.classList.remove('hidden');
642
+
643
+ setTimeout(() => {
644
+ toast.classList.add('hidden');
645
+ }, 3000);
646
+ }
647
+
648
+ // Initialize the app when DOM is loaded
649
+ document.addEventListener('DOMContentLoaded', initApp);
650
+ </script>
651
+ <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=privateuserh/privdmi1" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
652
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ Ensure all components are working correctly name the site DMIM Modify the explorer button to search for trends modify the library to add a hashtag to save the search add a private Cryptocurrency token named DMIM it's a Bitcoin Cash CHIP Protocol token the user should be able to stake the tokens to the saved trend search and yield farm at 0.3% max correlate trends to token reference https://tokenexplorer.cash/?tokenId=81fd176d7e3769aad00bc21539082cc3345f9cd613623fa281e6726f451f32f9 and https://app.cauldron.quest/swap/81fd176d7e3769aad00bc21539082cc3345f9cd613623fa281e6726f451f32f9 and https://blockchair.com/bitcoin-cash/transaction/81fd176d7e3769aad00bc21539082cc3345f9cd613623fa281e6726f451f32f9 add a verified green checkmark next to the tokento the saved search also make the main screen cards a little taller make the user interface very simple and efficient