ghostesp.net/openwd.html at main · GhostESP-Revival/ghostesp.net · 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
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="theme-color" content="#000000">
  <title>WDMap - Wardriving Map - GhostESP</title>
  <meta name="description" content="WDMap - Client-side wardriving map for WiGLE CSV files. Visualize WiFi and BLE networks with GPS coordinates directly in your browser.">
  <meta name="keywords" content="WDMap, wardriving, WiGLE, WiFi map, BLE map, GPS, ESP32, GhostESP, wardrive, network mapping">
  <meta name="robots" content="index, follow">

  <meta property="og:type" content="website">
  <meta property="og:title" content="WDMap - Wardriving Map - GhostESP">
  <meta property="og:description" content="WDMap - Client-side wardriving map for WiGLE CSV files. Visualize WiFi and BLE networks with GPS coordinates directly in your browser.">
  <meta property="og:url" content="https://ghostesp.net/openwd">
  <meta property="og:site_name" content="GhostESP">
  <meta property="og:image" content="https://ghostesp.net/images/IMG_1178.webp">

  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:title" content="WDMap - Wardriving Map - GhostESP">
  <meta name="twitter:description" content="Client-side wardriving map for WiGLE CSV files.">
  <meta name="twitter:image" content="https://ghostesp.net/images/IMG_1178.webp">

  <link rel="canonical" href="https://ghostesp.net/openwd">
  <link rel="alternate" type="application/rss+xml" title="GhostESP Blog" href="https://ghostesp.net/feed.xml">

  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin="">
  <link rel="stylesheet" href="css/main.css">
  <link rel="stylesheet" href="css/openwd.css">

  <link rel="icon" type="image/x-icon" href="images/favicon.ico">
</head>
<body>
  <a href="#main-content" class="skip-link">Skip to content</a>
  <canvas id="dotTerrain"></canvas>
  <script src="js/dot-terrain.js"></script>
  <nav id="nav"><noscript><a href="/">Home</a> <a href="boards.html">Boards</a> <a href="flasher.html">Flasher</a> <a href="serial.html">Serial Console</a> <a href="marketplace.html">Apps</a> <a href="asset-marketplace.html">Asset Packs</a> <a href="irdb.html">IRDB</a> <a href="blog.html">Blog</a> <a href="https://docs.ghostesp.net">Docs</a></noscript></nav>

  <div class="openwd-container">
    <header class="openwd-header">
      <h1>WDMap</h1>
      <p class="header-description">Client-side wardriving map for WiGLE v1.6 CSV files</p>
    </header>

    <main id="main-content" class="openwd-main">
        <div class="openwd-toolbar">
          <div class="toolbar-row">
            <div class="import-controls">
              <input id="file-input" type="file" multiple accept=".csv,text/csv">
              <button id="import-btn" class="btn btn-primary">Import CSV</button>
              <input id="export-btn" type="button" class="btn" value="Export">
              <input id="load-input" type="file" accept=".json" style="display:none">
              <input id="load-btn" type="button" class="btn" value="Load">
              <button id="clear-btn" class="btn btn-danger">Clear</button>
            </div>
            <div class="toolbar-actions">
              <button id="filter-toggle" class="btn btn-ghost" aria-expanded="false">Filters</button>
              <button id="privacy-toggle" class="btn btn-ghost" aria-pressed="false">Privacy</button>
              <button id="animate-btn" class="btn btn-primary">Animate</button>
            </div>
          </div>
          <div id="filter-panel" class="filter-panel">
            <div class="filter-panel-row">
              <select id="filter-type" aria-label="Filter by network type">
                <option value="ALL">All Types</option>
                <option value="WIFI">WiFi</option>
                <option value="BLE">BLE</option>
              </select>
              <input id="filter-search" type="text" placeholder="Search SSID/MAC..." aria-label="Search SSID or MAC">
              <input id="filter-rssi-min" type="number" min="-140" max="0" placeholder="RSSI Min" aria-label="Minimum RSSI">
              <input id="filter-rssi-max" type="number" min="-140" max="0" placeholder="RSSI Max" aria-label="Maximum RSSI">
            </div>
            <div class="filter-panel-actions">
              <button id="apply-filters" class="btn">Apply</button>
              <button id="reset-filters" class="btn btn-ghost">Reset</button>
            </div>
          </div>
        </div>
        <div id="import-status" class="status"></div>

      <div class="app-shell">
        <aside class="panel">
          <section class="card">
            <h2>Datasets</h2>
            <div id="dataset-list" class="dataset-list"></div>
          </section>
        </aside>

        <div class="map-wrap">
          <div id="map"></div>
          <div class="time-slider-float">
            <span class="time-label">Time</span>
            <input type="range" id="time-slider" class="time-slider" min="0" max="100" value="100" aria-label="Time filter">
            <span id="time-display" class="time-display">All time</span>
            <label class="time-toggle">
              <input type="checkbox" id="time-all-toggle" checked>
              All time
            </label>
          </div>
          <div id="animate-overlay" class="animate-overlay" style="display:none">
            <div class="animate-stats">
              <div class="animate-stat-year" id="animate-year">2024</div>
              <div class="animate-stat-label" id="animate-date">January</div>
              <div class="animate-stat-main" id="animate-count">0</div>
              <div class="animate-stat-sub" id="animate-type">networks found</div>
              <div class="animate-stat-wifi" id="animate-wifi">0 WiFi</div>
              <div class="animate-stat-ble" id="animate-ble">0 BLE</div>
            </div>
          </div>
        </div>
      </div>
    </main>
  </div>

  <footer class="footer">
    <div class="container">
      <p>OpenWD - Wardriving map for WiGLE CSV files</p>
      <button class="cookie-settings-link" onclick="CookieConsent.showSettings()">Cookie Settings</button>
      <a href="privacy.html" class="cookie-settings-link">Privacy Policy</a>
    </div>
  </footer>

  <script src="https://unpkg.com/[email protected]/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/papaparse.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/supercluster.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/html2canvas.min.js"></script>
  <script src="https://unpkg.com/[email protected]/dist/umd/lucide.min.js" defer></script>
  <script src="js/components.js" defer></script>
  <script src="js/social-proof.js" defer></script>
  <script src="js/main.js" defer></script>
  <script src="js/openwd.js" defer></script>
  <script src="js/cookie-consent.js" defer></script>
</body>
</html>