ipa-archive/index.html at main · yoloforks/ipa-archive · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="IPA Archive - Archiving Every Delisted iOS App from the most well known to the most Obscure">
    <meta name="keywords" content="iOS, app archive, IPA, iOS apps, app icons, download, iOS software, iOS games, iOS app collection, legacy apps, iOS archive, IPA archive">
    <meta property="og:title" content="IPA Archive">
    <meta property="og:image" content="apple-touch-icon.png">
    <meta name="twitter:card" content="summary_large_image">
    <title>IPA Archive</title>
    <link rel="icon" href="apple-touch-icon.png" type="image/png">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <!-- Glossy Header -->
    <header id="header">
        <div class="header-content">
            <div class="header-logo">
                <a href="./" class="logo-image card-icon-glossy">
                    <img src="apple-touch-icon.png" alt="Logo">
                </a>
                <div class="header-text">
                    <h1>IPA Archive</h1>
                    <div id="statsBar" class="stats-bar">Loading database...</div>
                </div>
            </div>
            <div class="header-actions">
                <div class="random-controls">
                    <button class="primary-btn random-btn" onclick="randomIPA()">
                        <i class="fas fa-shuffle"></i> Random
                    </button>
                    <label class="primary-btn random-count-select" for="randomCountSelect">
                        <select id="randomCountSelect">
                            <option value="1">×1</option>
                            <option value="5" selected>×5</option>
                            <option value="10">×10</option>
                            <option value="30">×30</option>
                        </select>
                    </label>
                </div>
                <button class="primary-btn icon-only" id="themeToggle" onclick="toggleTheme()" aria-label="Toggle dark mode" title="Toggle dark mode">
                    <i class="fas fa-moon" id="themeIcon"></i>
                </button>
            </div>
        </div>
    </header>

    <!-- Search & Filter Container -->
    <div class="main-search-wrapper">
        <form id="searchForm" class="ios-form" onsubmit="event.preventDefault(); applyFilters();">
            <div class="search-row">
                <input type="text" id="searchInput" placeholder="Search apps..." class="ios-input main-search">
                <button type="submit" class="primary-btn large">Search</button>
            </div>
            <div class="filter-grid">
                <div class="filter-item">
                    <label>Bundle ID</label>
                    <input type="text" id="bundleid" placeholder="com.gameloft." class="ios-input">
                </div>
                <div class="filter-item">
                    <label>Min OS</label>
                    <input type="text" id="minos" placeholder="1.0" class="ios-input">
                </div>
                <div class="filter-item">
                    <label>Max OS</label>
                    <input type="text" id="maxos" placeholder="5.1.1" class="ios-input">
                </div>
                <div class="filter-item">
                    <label>Device</label>
                    <div class="ios-segmented-control" id="deviceSegments">
                        <button type="button" class="segment active" data-value="">Any</button>
                        <button type="button" class="segment" data-value="2" title="iPhone"><i class="fa-solid fa-mobile-screen-button"></i></button>
                        <button type="button" class="segment" data-value="4" title="iPad"><i class="fa-solid fa-tablet-screen-button"></i></button>
                    </div>
                    <input type="hidden" id="device" value="">
                </div>
                <div class="filter-item checkbox-item">
                    <label for="unique">Unique</label>
                    <input type="checkbox" id="unique" checked>
                </div>
            </div>
        </form>
    </div>

    <!-- Results Area -->
    <div id="resultsContainer" class="results-grid">
        <div id="searchResultCount" class="result-count-glossy" style="display: none;"></div>
        <div class="search-empty-state" id="searchEmptyState">
            <i class="fas fa-search search-icon"></i>
            <p class="search-message">No results found</p>
        </div>
        <div id="searchResults" class="app-grid"></div>
        <div id="pagination" class="ios-pagination"></div>
    </div>

    <!-- Modal Container -->
    <div id="modalContainer"></div>

    <script src="script.js"></script>
</body>
</html>