-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
141 lines (125 loc) · 9.17 KB
/
Copy pathindex.html
File metadata and controls
141 lines (125 loc) · 9.17 KB
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
138
139
140
141
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QR_DECRYPTR by Devdebug</title>
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300ff41' stroke-width='2'><rect x='3' y='3' width='7' height='7'/><rect x='14' y='3' width='7' height='7'/><rect x='3' y='14' width='7' height='7'/><rect x='14' y='14' width='3' height='3'/><rect x='18' y='14' width='3' height='3'/><rect x='14' y='18' width='3' height='3'/><rect x='18' y='18' width='3' height='3'/></svg>">
<script src="https://cdn.jsdelivr.net/npm/jsqr@1.4.0/dist/jsQR.min.js"></script>
<script src="https://cdn.tailwindcss.com"></script>
<script type="module" src="./src/main.js"></script>
</head>
<body class="block md:flex md:items-center md:justify-center min-h-screen p-4">
<div class="crt-overlay"></div>
<div class="border w-full md:bg-green-800 p-5 max-w-5xl mx-auto space-y-6 relative z-20">
<!-- Header -->
<header class="flex flex-row justify-between items-center border-b border-green-900 pb-4">
<div class="text-left">
<h1 class="text-2xl font-bold tracking-tighter uppercase">QR_DECRYPTOR</h1>
</div>
<div class="text-right">
<button id="clear-btn" class="px-3 py-1 border border-green-500 hover:bg-green-500 hover:text-black text-xs uppercase tracking-widest transition-all">Clear</button>
</div>
</header>
<div class="grid grid-cols-1 lg:grid-cols-12 gap-6">
<!-- Input Area -->
<div class="lg:col-span-5 space-y-6">
<div class="terminal-border bg-black/60 p-4 rounded-sm space-y-4">
<div class="flex justify-center">
<button id="camera-btn" class="px-4 py-2 border border-green-500 hover:bg-green-500 hover:text-black text-xs uppercase tracking-widest transition-all flex items-center gap-2">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"></path>
</svg>
<span>Camera</span>
</button>
</div>
<!-- Camera View -->
<div id="camera-container" class="hidden">
<video id="camera-video" class="w-full rounded-sm" autoplay playsinline></video>
<div class="flex justify-center mt-3 gap-3">
<button id="capture-btn" class="px-4 py-2 border border-green-500 hover:bg-green-500 hover:text-black text-xs uppercase tracking-widest transition-all">Capture</button>
<button id="close-camera-btn" class="px-4 py-2 border border-red-500 hover:bg-red-500 hover:text-black text-xs uppercase tracking-widest transition-all">Close</button>
</div>
</div>
<label id="upload-area" class="flex flex-col items-center justify-center w-full min-h-[150px] border border-dashed border-green-900/50 rounded-sm cursor-pointer hover:bg-green-500/5 transition-all">
<div class="flex flex-col items-center justify-center p-6 text-center">
<svg class="w-10 h-10 mb-4 opacity-70" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" stroke-width="1.5"></path>
</svg>
<p class="text-xs font-bold uppercase tracking-widest mb-2">Upload_Image</p>
<p class="text-[10px] opacity-60">Drag & drop or click to select</p>
</div>
<input id="file-input" type="file" class="hidden" accept="image/*" />
</label>
</div>
<div id="image-preview-container" class="hidden terminal-border bg-black p-2 flex items-center justify-center overflow-hidden scan-active">
<canvas id="preview-canvas"></canvas>
</div>
</div>
<!-- Output Area -->
<div class="lg:col-span-7 flex flex-col">
<div class="terminal-border bg-black/80 flex-1 p-6 rounded-sm min-h-[400px]">
<div class="flex justify-between items-center mb-6 border-b border-green-900/50 pb-2">
<span class="text-xs font-bold uppercase tracking-widest">DECODED_DATA</span>
<div id="status-badge" class="px-2 py-0.5 border border-green-900 text-[9px] uppercase">Waiting</div>
</div>
<div id="loading-spinner" class="hidden flex items-center justify-center py-8">
<div class="spinner"></div>
<span class="ml-4 text-xs uppercase tracking-widest">Decoding...</span>
</div>
<div id="decoded-info" class="hidden space-y-6 animate-in fade-in duration-700">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="p-3 bg-green-500/5 border border-green-900">
<p class="text-[9px] uppercase font-bold text-green-700 mb-1">Type</p>
<p id="res-type" class="text-sm font-bold truncate">---</p>
</div>
<div id="wifi-flag" class="hidden p-3 bg-green-500/10 border border-green-500">
<p class="text-[9px] uppercase font-bold text-green-700 mb-1">Status</p>
<p class="text-sm font-bold">WIFI_PAYLOAD</p>
</div>
</div>
<!-- WiFi Details -->
<div id="wifi-grid" class="hidden grid grid-cols-1 gap-2 border-l-2 border-green-500 pl-4">
<div>
<span class="text-[9px] uppercase opacity-40 block">SSID:</span>
<span id="wifi-ssid" class="text-sm font-bold">---</span>
</div>
<div>
<span class="text-[9px] uppercase opacity-40 block">Password:</span>
<div class="flex items-center gap-2">
<span id="wifi-pass" class="text-sm font-bold select-all filter blur-sm hover:blur-none transition-all cursor-help">---</span>
<button id="copy-pass-btn" class="hidden px-2 py-1 border border-green-500 hover:bg-green-500 hover:text-black text-[10px] uppercase tracking-widest transition-all" title="Copy password">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path>
</svg>
</button>
</div>
</div>
<div>
<span class="text-[9px] uppercase opacity-40 block">Encryption:</span>
<span id="wifi-encryption" class="text-sm">---</span>
</div>
</div>
<div class="space-y-2">
<p class="text-[9px] uppercase font-bold text-green-700">Content</p>
<div class="bg-black p-4 border border-green-900 rounded-sm max-h-48 overflow-y-auto custom-scrollbar">
<code id="res-raw" class="text-xs break-all text-green-400 font-mono"></code>
</div>
</div>
<button id="copy-btn" class="px-6 py-2 border border-green-500 hover:bg-green-500 hover:text-black font-bold text-xs transition-all uppercase tracking-widest">
Copy_Data
</button>
</div>
<div id="no-result" class="h-full flex items-center justify-center opacity-20">
<p id="awaiting-text" class="text-xs italic">Awaiting input...</p>
</div>
</div>
</div>
</div>
</div>
<!-- Footer -->
<footer class="fixed bottom-0 w-full text-center py-4 border-t border-green-900/50">
<p class="text-[10px] opacity-60 uppercase tracking-widest">Made by Devdebug</p>
</footer>
</body>
</html>