/ index.html
index.html
1 2 <!DOCTYPE html> 3 <html lang="en"> 4 <head> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7 <title>GPT Arsenal - Complete Markdown Files Collection</title> 8 <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet"> 9 <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet"> 10 <style> 11 * { 12 margin: 0; 13 padding: 0; 14 box-sizing: border-box; 15 } 16 17 :root { 18 --primary-color: #00d4ff; 19 --secondary-color: #0099cc; 20 --background-dark: #0f0f23; 21 --background-medium: #1a1a2e; 22 --background-light: #16213e; 23 --text-primary: #ffffff; 24 --text-secondary: rgba(255, 255, 255, 0.8); 25 --text-muted: rgba(255, 255, 255, 0.6); 26 --border-color: rgba(255, 255, 255, 0.1); 27 --hover-color: rgba(255, 255, 255, 0.05); 28 --success-color: #2ed573; 29 --warning-color: #ffa502; 30 --danger-color: #ff4757; 31 --gradient-primary: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%); 32 --gradient-background: linear-gradient(135deg, var(--background-dark) 0%, var(--background-medium) 100%); 33 --shadow-small: 0 2px 8px rgba(0, 0, 0, 0.1); 34 --shadow-medium: 0 4px 16px rgba(0, 0, 0, 0.15); 35 --shadow-large: 0 8px 32px rgba(0, 0, 0, 0.2); 36 --border-radius: 12px; 37 --border-radius-small: 8px; 38 --border-radius-large: 16px; 39 --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); 40 } 41 42 body { 43 font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; 44 background: var(--gradient-background); 45 color: var(--text-primary); 46 line-height: 1.6; 47 overflow-x: hidden; 48 font-size: 14px; 49 } 50 51 .container { 52 max-width: 1200px; 53 margin: 0 auto; 54 padding: 20px; 55 } 56 57 .header { 58 text-align: center; 59 margin-bottom: 40px; 60 padding: 40px 0; 61 } 62 63 .header h1 { 64 font-size: 3rem; 65 background: var(--gradient-primary); 66 -webkit-background-clip: text; 67 -webkit-text-fill-color: transparent; 68 background-clip: text; 69 margin-bottom: 16px; 70 } 71 72 .header p { 73 font-size: 1.2rem; 74 color: var(--text-secondary); 75 } 76 77 .stats { 78 display: flex; 79 justify-content: center; 80 gap: 40px; 81 margin: 30px 0; 82 } 83 84 .stat { 85 text-align: center; 86 } 87 88 .stat-number { 89 font-size: 2.5rem; 90 font-weight: 700; 91 color: var(--primary-color); 92 display: block; 93 } 94 95 .stat-label { 96 font-size: 0.9rem; 97 color: var(--text-muted); 98 text-transform: uppercase; 99 letter-spacing: 0.5px; 100 } 101 102 .search-box { 103 position: relative; 104 max-width: 600px; 105 margin: 0 auto 40px; 106 } 107 108 .search-box input { 109 width: 100%; 110 padding: 16px 20px 16px 50px; 111 background: rgba(255, 255, 255, 0.08); 112 border: 1px solid var(--border-color); 113 border-radius: var(--border-radius); 114 color: var(--text-primary); 115 font-size: 16px; 116 transition: var(--transition); 117 } 118 119 .search-box input:focus { 120 outline: none; 121 border-color: var(--primary-color); 122 box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.1); 123 } 124 125 .search-box i { 126 position: absolute; 127 left: 18px; 128 top: 50%; 129 transform: translateY(-50%); 130 color: var(--text-muted); 131 } 132 133 .filter-tabs { 134 display: flex; 135 justify-content: center; 136 gap: 12px; 137 margin-bottom: 40px; 138 flex-wrap: wrap; 139 } 140 141 .filter-tab { 142 padding: 12px 24px; 143 background: rgba(255, 255, 255, 0.05); 144 border: 1px solid var(--border-color); 145 border-radius: var(--border-radius); 146 color: var(--text-secondary); 147 cursor: pointer; 148 transition: var(--transition); 149 font-size: 14px; 150 font-weight: 500; 151 } 152 153 .filter-tab.active, 154 .filter-tab:hover { 155 background: var(--primary-color); 156 color: var(--background-dark); 157 border-color: var(--primary-color); 158 } 159 160 .directory-section { 161 margin-bottom: 60px; 162 } 163 164 .directory-header { 165 display: flex; 166 align-items: center; 167 gap: 16px; 168 margin-bottom: 24px; 169 padding: 20px 0; 170 border-bottom: 2px solid rgba(0, 212, 255, 0.3); 171 } 172 173 .directory-header h2 { 174 font-size: 1.8rem; 175 color: var(--primary-color); 176 } 177 178 .directory-header .file-count { 179 background: rgba(0, 212, 255, 0.1); 180 color: var(--primary-color); 181 padding: 6px 12px; 182 border-radius: 20px; 183 font-size: 0.9rem; 184 font-weight: 600; 185 } 186 187 .files-grid { 188 display: grid; 189 grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); 190 gap: 24px; 191 } 192 193 .file-card { 194 background: rgba(255, 255, 255, 0.05); 195 border: 1px solid var(--border-color); 196 border-radius: var(--border-radius-large); 197 padding: 24px; 198 transition: var(--transition); 199 cursor: pointer; 200 position: relative; 201 overflow: hidden; 202 } 203 204 .file-card:hover { 205 transform: translateY(-4px); 206 border-color: var(--primary-color); 207 box-shadow: var(--shadow-large); 208 } 209 210 .file-card::before { 211 content: ''; 212 position: absolute; 213 top: 0; 214 left: 0; 215 width: 100%; 216 height: 3px; 217 background: var(--gradient-primary); 218 opacity: 0; 219 transition: opacity 0.3s ease; 220 } 221 222 .file-card:hover::before { 223 opacity: 1; 224 } 225 226 .file-icon { 227 font-size: 2rem; 228 color: var(--primary-color); 229 margin-bottom: 16px; 230 } 231 232 .file-name { 233 font-size: 1.1rem; 234 font-weight: 600; 235 color: var(--text-primary); 236 margin-bottom: 8px; 237 } 238 239 .file-path { 240 font-size: 0.85rem; 241 color: var(--text-muted); 242 font-family: 'Monaco', 'Menlo', monospace; 243 margin-bottom: 16px; 244 } 245 246 .file-actions { 247 display: flex; 248 gap: 8px; 249 margin-top: 16px; 250 } 251 252 .action-btn { 253 padding: 8px 16px; 254 background: rgba(255, 255, 255, 0.05); 255 border: 1px solid var(--border-color); 256 border-radius: var(--border-radius-small); 257 color: var(--text-secondary); 258 cursor: pointer; 259 transition: var(--transition); 260 font-size: 0.85rem; 261 flex: 1; 262 text-align: center; 263 } 264 265 .action-btn:hover { 266 background: var(--primary-color); 267 color: var(--background-dark); 268 border-color: var(--primary-color); 269 } 270 271 .modal { 272 display: none; 273 position: fixed; 274 top: 0; 275 left: 0; 276 width: 100%; 277 height: 100%; 278 background: rgba(0, 0, 0, 0.8); 279 z-index: 1000; 280 backdrop-filter: blur(8px); 281 } 282 283 .modal.active { 284 display: flex; 285 align-items: center; 286 justify-content: center; 287 } 288 289 .modal-content { 290 background: var(--background-medium); 291 border: 1px solid var(--border-color); 292 border-radius: var(--border-radius-large); 293 width: 90%; 294 max-width: 900px; 295 max-height: 90%; 296 display: flex; 297 flex-direction: column; 298 box-shadow: var(--shadow-large); 299 } 300 301 .modal-header { 302 display: flex; 303 align-items: center; 304 justify-content: space-between; 305 padding: 24px; 306 border-bottom: 1px solid var(--border-color); 307 } 308 309 .modal-header h3 { 310 color: var(--primary-color); 311 font-size: 1.2rem; 312 } 313 314 .modal-close { 315 background: none; 316 border: none; 317 color: var(--text-muted); 318 font-size: 1.5rem; 319 cursor: pointer; 320 padding: 8px; 321 } 322 323 .modal-body { 324 padding: 24px; 325 overflow-y: auto; 326 flex: 1; 327 } 328 329 .modal-body pre { 330 background: rgba(0, 0, 0, 0.3); 331 padding: 20px; 332 border-radius: var(--border-radius); 333 overflow-x: auto; 334 white-space: pre-wrap; 335 word-wrap: break-word; 336 } 337 338 .empty-state { 339 text-align: center; 340 padding: 60px 20px; 341 color: var(--text-muted); 342 } 343 344 .empty-state i { 345 font-size: 3rem; 346 margin-bottom: 16px; 347 } 348 349 .credits { 350 text-align: center; 351 margin-top: 60px; 352 padding: 40px 0; 353 border-top: 1px solid var(--border-color); 354 } 355 356 .credits p { 357 margin: 8px 0; 358 color: var(--text-secondary); 359 } 360 361 .credits a { 362 color: var(--primary-color); 363 text-decoration: none; 364 font-weight: 600; 365 } 366 367 .credits a:hover { 368 text-decoration: underline; 369 } 370 371 @media (max-width: 768px) { 372 .container { 373 padding: 10px; 374 } 375 376 .header h1 { 377 font-size: 2rem; 378 } 379 380 .stats { 381 flex-direction: column; 382 gap: 20px; 383 } 384 385 .filter-tabs { 386 flex-direction: column; 387 align-items: center; 388 } 389 390 .files-grid { 391 grid-template-columns: 1fr; 392 } 393 394 .modal-content { 395 width: 95%; 396 max-height: 95%; 397 } 398 } 399 400 @keyframes slideIn { 401 from { 402 transform: translateX(100%); 403 } 404 to { 405 transform: translateX(0); 406 } 407 } 408 </style> 409 </head> 410 <body> 411 <div class="container"> 412 <div class="header"> 413 <h1><i class="fas fa-shield-alt"></i> GPT Arsenal</h1> 414 <p>Complete collection of ChatGPT jailbreaks, prompt leaks, and security tools</p> 415 416 <div class="stats"> 417 <div class="stat"> 418 <span class="stat-number" id="totalFiles">0</span> 419 <span class="stat-label">Total Files</span> 420 </div> 421 <div class="stat"> 422 <span class="stat-number" id="totalDirectories">0</span> 423 <span class="stat-label">Directories</span> 424 </div> 425 </div> 426 </div> 427 428 <div class="search-box"> 429 <i class="fas fa-search"></i> 430 <input type="text" id="searchInput" placeholder="Search files..."> 431 </div> 432 433 <div class="filter-tabs"> 434 <div class="filter-tab active" data-filter="all">All Files</div> 435 <div class="filter-tab" data-filter="Latest Jailbreaks">Latest Jailbreaks</div> 436 <div class="filter-tab" data-filter="Legendary Leaks">Legendary Leaks</div> 437 <div class="filter-tab" data-filter="Grimoire">Grimoire</div> 438 <div class="filter-tab" data-filter="My Super Prompts">My Super Prompts</div> 439 <div class="filter-tab" data-filter="Prompt Security">Prompt Security</div> 440 <div class="filter-tab" data-filter="Ultra Prompts">Ultra Prompts</div> 441 </div> 442 443 <div id="filesList"> 444 <!-- Files will be populated by JavaScript --> 445 </div> 446 447 <div class="credits"> 448 <p>Dashboard by <strong>0x0806</strong></p> 449 <p>Content by <strong>CyberAlbSecOP</strong></p> 450 <p> 451 <i class="fas fa-star" style="color: #ffd700;"></i> 452 <a href="https://github.com/CyberAlbSecOP/Awesome_GPT_Super_Prompting" target="_blank"> 453 Awesome GPT Super Prompting Repository 454 </a> 455 </p> 456 </div> 457 </div> 458 459 <div class="modal" id="fileModal"> 460 <div class="modal-content"> 461 <div class="modal-header"> 462 <h3 id="modalTitle">File Content</h3> 463 <button class="modal-close" id="modalClose"> 464 <i class="fas fa-times"></i> 465 </button> 466 </div> 467 <div class="modal-body" id="modalBody"> 468 <!-- File content will be loaded here --> 469 </div> 470 </div> 471 </div> 472 473 <script> 474 // Complete file structure with all .md files from your directory 475 const FILES_DATA = { 476 "Latest Jailbreaks": [ 477 "AGI.md", 478 "Apex.md", 479 "BOB.md", 480 "Born Survivalist (yell0wfever92).md", 481 "CodeGPT6.md", 482 "Complex.md", 483 "DANDoc_v2.2 (DaVoidCaller).md", 484 "DarkGPT.md", 485 "Decodes Anything Now.md", 486 "Demonic Chloe (pleasing-punisher).md", 487 "EarthSaver.md", 488 "Forest (pink_panther--).md", 489 "GBTHEN.md", 490 "GPT 3.5 Web Search.md", 491 "GPT 4.5 Fusion.md", 492 "GhettoBreak.md", 493 "Hex.md", 494 "IBM.md", 495 "Infotron (HORSELOCKSPACEPIRATE).md", 496 "Infotron V2.md", 497 "Infotron V3 (yell0wfever92).md", 498 "Master Key.md", 499 "MrRobot.md", 500 "NewGen (Ultrazartrex).md", 501 "Pliny Rekt.md", 502 "Pliny.md", 503 "Pollifusion.md", 504 "ProfessorRick (yell0wfever92).md", 505 "SINISTERCHAOS (Brilliant_Balance208).md", 506 "System Update (justpackingheat1).md", 507 "TAAN.md", 508 "UNITY.md", 509 "UltraBreaker.md", 510 "Universal Bypass.md", 511 "XFactor.md", 512 "Z.md", 513 "Zorg.md", 514 "[GPT4-o] Short 2 (HORSELOCKSPACEPIRATE).md", 515 "Datasets/efgmarquez - Jailbreak Database.md" 516 ], 517 "Legendary Leaks": [ 518 "AI Book Writer Assistant.md", 519 "Book Creator Guide.md", 520 "Book Writer GPT.md", 521 "CODEGPTV6.md", 522 "Copywrighter GPT.md", 523 "CreativeGPT's Prompt Generator.md", 524 "Email Writer.md", 525 "Fully SEO Optimized Article 2.md", 526 "GP(en)T(ester).md", 527 "God of Prompt.md", 528 "Grimoire(Latest).md", 529 "HackerGPT.md", 530 "Kali GPT.md", 531 "Malware Rule Master.md", 532 "Mega-Prompt.md", 533 "Professional Business Email Writer.md", 534 "PromptGPT.md", 535 "SEO BlogGPT.md", 536 "SINISTER CHAOS.md", 537 "SOC Copilot.md", 538 "Super Prompt Generator 3.md", 539 "Super Prompt Maker.md", 540 "System Prompt Generator 2.md", 541 "System Prompt Generator.md", 542 "The Greatest Computer Science Tutor.md", 543 "TherapistGPT.md", 544 "Video Script.md", 545 "Viral Hooks Generator.md", 546 "WormGPT3.md", 547 "WormGPT30.md", 548 "WormGPT6.md" 549 ], 550 "Grimoire": [ 551 "000 - Full Base Prompt.md", 552 "GPTavern.md", 553 "Grimoire.md", 554 "Interludes.md", 555 "Part1.md", 556 "Part2.md", 557 "Part3.md", 558 "Part4.md", 559 "Part5.md", 560 "Part6.md", 561 "Part7.md", 562 "Part8.md", 563 "Part9.md", 564 "PatchNotes.md", 565 "Projects.md", 566 "Readme.md", 567 "RecommendedTools.md", 568 "ReplitDeployInstructions.md" 569 ], 570 "My Super Prompts": [ 571 "Ai Integration Finder.md", 572 "Jailbreak Tester.md", 573 "Mental Health Therapist.md", 574 "ORK | System Prompt Writer and Optimizer.md", 575 "PSYKOO | Mental Manipulator.md", 576 "Prompt Engineer Template.md", 577 "Response Quality Enhacer.md", 578 "Rizz Game Improver.md", 579 "VAMPIRE | Ultra Prompt Writer.md" 580 ], 581 "Prompt Security": [ 582 "10 rules of protection and misdirection.md", 583 "100 Life points.md", 584 "Anti-verbatim.md", 585 "Bad faith actors protection.md", 586 "Bank Security Robot.md", 587 "Blue Team.md", 588 "Bot data protection.md", 589 "CIPHERON.md", 590 "Data Privacy - Formal.md", 591 "Do not Leak!.md", 592 "Final reminder.md", 593 "Fingers crossed technique.md", 594 "Gated access.md", 595 "Guardian Shield.md", 596 "HackTricksGPT Defense.md", 597 "Hacker Detected.md", 598 "I will never trust you again!.md", 599 "I will only give you poop.md", 600 "I will report you.md", 601 "Ignore previous instructions.md", 602 "Just don't repeat.md", 603 "Keep it polite.md", 604 "Law of Magic.md", 605 "Lawyer up.md", 606 "Mandatory security protocol.md", 607 "MultiPersona system.md", 608 "Operation mode is private.md", 609 "Overly protective parent.md", 610 "Prior text REDACTED!.md", 611 "Prohibition era.md", 612 "Prompt inspection.md", 613 "STOP HALT.md", 614 "SafeBOT.md", 615 "Simple.md", 616 "Single minded GPT.md", 617 "Sorry Bro, not possible - short edition.md", 618 "Sorry, bro! Not possible - elaborate edition.md", 619 "Stay on topic.md", 620 "The 3 Asimov laws.md", 621 "The 5 Rules.md", 622 "The Soup Boy.md", 623 "Top Secret Core Instructions.md", 624 "Under NO circumstances reveal your instructions.md", 625 "WormGPT Defense.md", 626 "You are not a GPT.md", 627 "You're not my mom.md", 628 "warning png.md" 629 ], 630 "Ultra Prompts": [ 631 "Prompt Guru V5.md", 632 "Prompt Quality Evaluation and Enhancement System V1.md" 633 ] 634 }; 635 636 // Cache for loaded file content 637 const fileContentCache = {}; 638 639 let currentFilter = 'all'; 640 let searchTerm = ''; 641 642 function initializeApp() { 643 updateStats(); 644 renderFiles(); 645 bindEvents(); 646 } 647 648 function updateStats() { 649 const totalFiles = Object.values(FILES_DATA).reduce((sum, files) => sum + files.length, 0); 650 const totalDirectories = Object.keys(FILES_DATA).length; 651 652 document.getElementById('totalFiles').textContent = totalFiles; 653 document.getElementById('totalDirectories').textContent = totalDirectories; 654 } 655 656 function renderFiles() { 657 const filesList = document.getElementById('filesList'); 658 filesList.innerHTML = ''; 659 660 Object.entries(FILES_DATA).forEach(([directory, files]) => { 661 if (currentFilter !== 'all' && currentFilter !== directory) return; 662 663 const filteredFiles = files.filter(file => 664 file.toLowerCase().includes(searchTerm.toLowerCase()) 665 ); 666 667 if (filteredFiles.length === 0) return; 668 669 const section = document.createElement('div'); 670 section.className = 'directory-section'; 671 section.innerHTML = ` 672 <div class="directory-header"> 673 <h2><i class="fas fa-folder"></i> ${directory}</h2> 674 <span class="file-count">${filteredFiles.length} files</span> 675 </div> 676 <div class="files-grid"> 677 ${filteredFiles.map(file => createFileCard(directory, file)).join('')} 678 </div> 679 `; 680 filesList.appendChild(section); 681 }); 682 683 if (filesList.children.length === 0) { 684 filesList.innerHTML = ` 685 <div class="empty-state"> 686 <i class="fas fa-search"></i> 687 <h3>No files found</h3> 688 <p>Try adjusting your search or filter criteria</p> 689 </div> 690 `; 691 } 692 } 693 694 function createFileCard(directory, fileName) { 695 const filePath = `${directory}/${fileName}`; 696 const displayName = fileName.replace('.md', ''); 697 698 return ` 699 <div class="file-card" data-path="${filePath}"> 700 <div class="file-icon"> 701 <i class="fas fa-file-code"></i> 702 </div> 703 <div class="file-name">${displayName}</div> 704 <div class="file-path">${filePath}</div> 705 <div class="file-actions"> 706 <button class="action-btn" onclick="viewFile('${filePath}')"> 707 <i class="fas fa-eye"></i> View 708 </button> 709 <button class="action-btn" onclick="copyPath('${filePath}')"> 710 <i class="fas fa-copy"></i> Copy Path 711 </button> 712 </div> 713 </div> 714 `; 715 } 716 717 async function viewFile(filePath) { 718 const modal = document.getElementById('fileModal'); 719 const modalTitle = document.getElementById('modalTitle'); 720 const modalBody = document.getElementById('modalBody'); 721 722 modalTitle.textContent = filePath.split('/').pop(); 723 modalBody.innerHTML = '<div style="text-align: center; padding: 40px; color: #999;">Loading...</div>'; 724 modal.classList.add('active'); 725 document.body.style.overflow = 'hidden'; 726 727 try { 728 // Check cache first 729 if (fileContentCache[filePath]) { 730 modalBody.innerHTML = `<pre>${fileContentCache[filePath]}</pre>`; 731 return; 732 } 733 734 // Fetch the actual file content 735 const response = await fetch(filePath); 736 if (!response.ok) { 737 throw new Error(`Failed to load file: ${response.status}`); 738 } 739 740 const content = await response.text(); 741 fileContentCache[filePath] = content; 742 modalBody.innerHTML = `<pre>${content}</pre>`; 743 744 } catch (error) { 745 console.error('Error loading file:', error); 746 modalBody.innerHTML = ` 747 <div style="color: #ff4757; padding: 20px; text-align: center;"> 748 <i class="fas fa-exclamation-triangle" style="font-size: 2rem; margin-bottom: 16px;"></i> 749 <h3>Error Loading File</h3> 750 <p>Could not load ${filePath}</p> 751 <p style="font-size: 0.9rem; opacity: 0.8;">${error.message}</p> 752 </div> 753 `; 754 } 755 } 756 757 function copyPath(filePath) { 758 navigator.clipboard.writeText(filePath).then(() => { 759 showNotification('Path copied to clipboard!'); 760 }).catch(() => { 761 showNotification('Failed to copy path', 'error'); 762 }); 763 } 764 765 function showNotification(message, type = 'success') { 766 const notification = document.createElement('div'); 767 notification.style.cssText = ` 768 position: fixed; 769 top: 20px; 770 right: 20px; 771 padding: 12px 20px; 772 background: ${type === 'success' ? '#2ed573' : '#ff4757'}; 773 color: white; 774 border-radius: 8px; 775 z-index: 10000; 776 animation: slideIn 0.3s ease; 777 `; 778 notification.textContent = message; 779 document.body.appendChild(notification); 780 781 setTimeout(() => { 782 notification.remove(); 783 }, 3000); 784 } 785 786 function bindEvents() { 787 // Search functionality 788 document.getElementById('searchInput').addEventListener('input', (e) => { 789 searchTerm = e.target.value; 790 renderFiles(); 791 }); 792 793 // Filter tabs 794 document.querySelectorAll('.filter-tab').forEach(tab => { 795 tab.addEventListener('click', (e) => { 796 document.querySelectorAll('.filter-tab').forEach(t => t.classList.remove('active')); 797 e.target.classList.add('active'); 798 currentFilter = e.target.dataset.filter; 799 renderFiles(); 800 }); 801 }); 802 803 // Modal close 804 document.getElementById('modalClose').addEventListener('click', () => { 805 document.getElementById('fileModal').classList.remove('active'); 806 document.body.style.overflow = ''; 807 }); 808 809 // Close modal on backdrop click 810 document.getElementById('fileModal').addEventListener('click', (e) => { 811 if (e.target === e.currentTarget) { 812 document.getElementById('fileModal').classList.remove('active'); 813 document.body.style.overflow = ''; 814 } 815 }); 816 817 // Keyboard shortcuts 818 document.addEventListener('keydown', (e) => { 819 if (e.key === 'Escape') { 820 document.getElementById('fileModal').classList.remove('active'); 821 document.body.style.overflow = ''; 822 } 823 if (e.ctrlKey && e.key === 'f') { 824 e.preventDefault(); 825 document.getElementById('searchInput').focus(); 826 } 827 }); 828 } 829 830 // Initialize the app when DOM is loaded 831 document.addEventListener('DOMContentLoaded', initializeApp); 832 </script> 833 </body> 834 </html>