-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
420 lines (419 loc) · 37 KB
/
index.html
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
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Python Minifier - GLAD432</title>
<meta name="robots" content="index, follow">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="description" content="Optimize your web app's performance with our Python minifier online. Python minifier remove whitespace, comments, and line breaks to compress code, optimizing script size for faster loading and improved efficiency." />
<meta name="keywords" content="Python, minifier, Python code optimization, online tool, script compression, code minification, web development, optimize Python code, improve script performance, reduce code size, web application optimization, code efficiency, code speed, streamline Python scripts">
<meta name="author" content="Glad432">
<link rel="canonical" href="https://glad432.github.io" />
<meta property="og:locale" content="en_US" />
<meta property="og:title" content="Python Minifier - GLAD432" />
<meta property="og:type" content="Website" />
<meta property="og:description" content="Optimize your web app's performance with our Python minifier online. Python minifier removes whitespace, comments, and line breaks to compress code, optimizing script size for faster loading and improved efficiency." />
<meta property="og:site_name" content="Python Minifier - GLAD432" />
<meta property="og:image" content="https://glad432.github.io/favicon.ico" />
<meta property="og:image:secure_url" content="https://glad432.github.io/favicon.ico" />
<meta property="og:image:width" content="225" />
<meta property="og:image:height" content="225" />
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@gladw_in">
<meta name="twitter:creator" content="@gladw_in">
<meta name="twitter:title" content="Python Minifier - GLAD432">
<meta name="twitter:domain" content="glad432.github.io">
<meta name="twitter:description" content="Optimize your web app's performance with our Python minifier online. Python minifier remove whitespace, comments, and line breaks to compress code, optimizing script size for faster loading and improved efficiency.">
<meta name="twitter:image" content="https://glad432.github.io/favicon.ico">
<meta name="twitter:image:src" content="https://glad432.github.io/favicon.ico">
<meta name="twitter:image:alt" content="Python Minifier - GLAD432">
<link href="/css/style.css" rel="stylesheet">
<link rel="icon" type="image/png" href="https://glad432.github.io/favicon.ico" />
<link rel="shortcut icon" href="https://glad432.github.io/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon-precomposed" href="https://glad432.github.io/favicon.ico" />
<meta name="msapplication-TileImage" content="https://glad432.github.io/favicon.ico" />
<script async src="https://www.googletagmanager.com/gtag/js?id=G-HDTEFZ9987"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'G-HDTEFZ9987');
</script>
<script>
document.addEventListener("DOMContentLoaded", function() {
let e = document.getElementById("darkModeToggle"),
t = localStorage.getItem("darkMode") !== "true";
e.addEventListener("change", function() {
let t = !document.documentElement.classList.contains("dark");
document.documentElement.classList.toggle("dark", t);
document.documentElement.classList.toggle("light", !t);
localStorage.setItem("darkMode", t.toString());
});
document.documentElement.classList.toggle("dark", !t);
document.documentElement.classList.toggle("light", t);
e.checked = !t;
});
</script>
</head>
<body class="bg-gray-100 font-sans select-none transition-colors duration-200 ease-in-out">
<header class="top-0 z-30 w-full px-2 py-4 bg-black shadow-xl shadow-black-600/20 sm:px-4">
<div class="flex items-center justify-between mx-auto max-w-7xl">
<span class="pl-4 text-2xl font-extrabold text-white">
<a href="https://glad432.github.io" title="Python Minifier - GLAD432">
<img src="/img/logo.webp" height="44" width="196" alt="Glad432" oncontextmenu="return false;">
</a>
</span>
<label class="inline-block ml-auto relative w-8 h-8 switch">
<input type="checkbox" id="darkModeToggle" aria-label="Toggle dark mode">
<span class="slide top-0 left-0 right-0 bottom-0 round rounded-full absolute before:font-['Font_Awesome_6_Free'] before:top-[3.5px] before:left-[7px] before:font-black before:text-lg before:text-white before:absolute before:content-['\f185'] cursor-pointer hover:bg-blue-700"></span>
</label>
<div class="flex items-center space-x-1">
<nav>
<ul class="hidden space-x-2 md:inline-flex">
<li>
<a href="https://github.com/gladw-in" target="_blank" rel="noopener noreferrer" class="px-4 py-2 font-semibold text-white rounded hover:text-blue-700">Github</a>
</li>
</ul>
</nav>
<div class="inline-flex md:hidden">
<button aria-label="Open menu" class="flex-none px-2 text-2xl text-white" id="menuToggle">
<svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 8h16M4 16h16" />
</svg>
</button>
<div class="absolute top-0 left-0 right-0 z-50 flex-col p-2 pb-4 m-2 space-y-3 bg-black rounded shadow hidden" id="menu">
<button aria-label="Close menu" class="self-end flex-none px-2 ml-2 text-2xl text-white" id="menuClose">
<svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
<nav>
<ul class="space-y-2">
<li>
<a href="https://github.com/gladw-in" target="_blank" rel="noopener noreferrer" class="px-4 py-2 font-semibold text-white rounded hover:text-blue-700">Github</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</div>
</header>
<div class="mx-4 md:mx-auto md:max-w-2xl lg:max-w-4xl xl:max-w-6xl p-4 md:p-8 bg-white mt-8 mb-8 rounded-lg shadow">
<div class="rounded p-5 mb-5 border-2 text-center border-solid simp_border">
<h1 class="mb-4 text-3xl font-extrabold text-white md:text-5xl lg:text-6xl">
<span class="cursor-default text-transparent bg-clip-text bg-gradient-to-r from-indigo-500 via-blue-400 to-blue-400">Python Minifier</span>
</h1>
<div class="mb-2 md:mb-4">
<div class="mb-3 text-gray-700 text-[13px] lg:text-[15px] font-['Source_Code_Pro']">Optimizing Python Code for <span id="anitext" class="font-bold"></span>
</div>
</div>
</div>
<h2 class="relative text-2xl font-bold mt-8 mb-5 text-white bg-black block rounded py-6 pl-[15px] [box-shadow:0_0_2px_rgb(0_0_0/30%)] [border-left:5px_solid_#3b82f6]">Original Code</h2>
<div id="tabs-overlay" class="hidden cursor-default absolute h-[340px] z-10 left-[1vh] right-[1vh] bg-transparent"></div>
<button id="from_url" class="text-base font-bold bg-green-500 text-white py-1 px-2 rounded hover:bg-green-600 ease-out overflow-hidden transform">Load from URL <i id="fade-4" class="fa-solid fa-link"></i>
</button>
<div id="inputContainer" class="hidden mt-4 colorhandle">
<div class="flex flex-col items-center">
<div class="flex items-center">
<input type="text" id="fileLinkInput" placeholder="Enter .py link (400kb) max" class="cursor-text border border-gray-300 text-sm rounded-lg focus:outline-none focus:ring-blue-500 focus:border-blue-500 py-2 px-4">
<button id="load_File" title="Or click Enter button to load" class="text-base ml-2 font-bold bg-red-500 text-white py-1 px-2 rounded hover:bg-red-600 ease-out overflow-hidden transform">Load <i id="fade-3" class="fa-solid fa-cloud-arrow-down"></i>
</button>
</div>
<div class="flex mr-auto text-sm cursor-pointer mt-1 ml-1 space-x-2 font-semibold">
<div class="help-container !relative !top-[1.5px] right-0 mr-2" oncontextmenu="return false">
<i class="fas fa-question-circle fa-sm text-sm text-blue-500"></i>
<div class="help-content absolute cursor-default rounded-lg">
<p class="text-sm text-gray-700">Only Raw Github URLs (400kb) are recommended</p>
</div>
</div>
<span id="sample_link" class="text-blue-600 hover:underline">Try sample URL <i id="fade-6" class="fa-solid fa-circle-arrow-up fa-sm"></i>
</span>
<span id="clear_link" class="text-red-500 hover:underline">Clear <i id="fade-7" class="fa-solid fa-trash-can fa-sm"></i>
</span>
</div>
</div>
</div>
<input class="hidden" type="file" id="fileInput" accept=".py" multiple />
<div id="dropArea" class="cursor-pointer rounded-xl border-dashed border-4 border-gray-300 colorhandle text-center bg-white p-4 md:p-8 m-5">Drag and drop <span class="font-bold pr-1">.py files</span>here or click to <span class="text-blue-600 font-bold hover:underline">browse <i class="fa-solid fa-file-arrow-up"></i>
</span>
</div>
<div class="text-left">
<span id="line-count" class="font-bold px-4 py-2 bg-blue-500 rounded text-white">Lines: 42</span>
<span id="text-size" class="font-bold px-4 py-2 bg-blue-500 rounded text-white">0.992 kB</span>
</div>
<p id="errmsg"></p>
<div class="flex items-center">
<ul id="file-tabs" class="list-none pr-px mr-1 [scrollbar-width:thin] pt-3 whitespace-nowrap inline-flex overflow-x-auto colorhandle">
<li class="file-tab relative cursor-pointer bg-[#f0f0f0] border-[#ccc] px-[25px] py-2 mb-[5px] border border-solid rounded mr-[5px] transition-opacity active" id="file-1" title="1st Tab">
<i class="fa-solid fa-file-code text-blue-600 pr-2"></i>File 1.py
</li>
</ul>
<button id="addNewTab" class="mt-2" title="click to add a new tab">
<i class="fa-solid fa-circle-plus fa-xl text-gray-700"></i>
</button>
</div>
<div id="editor" class="w-auto h-[300px] mt-0.5 rounded overflow-hidden border border-solid border-[#cccccc8f] [border-left:6px_solid_rgba(0,_83,_159,_0.65)]">
<div id="type-overlay" class="md:md:cursor-default md:absolute md:h-[300px] md:z-10 md:left-[10vh] md:right-[10vh] md:bg-transparent"></div>
</div>
<button id="clearAll" class="px-4 py-2 mt-2 font-bold cursor-pointer bg-red-500 rounded text-white hover:bg-red-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100">Clear <i id="fade-5" class="fa-solid fa-trash fa-xs"></i>
</button>
<div class="text-left w-[500px] my-10 p-4 rounded border-t-[5px] border-solid border-blue-500 blue_big_box md:mx-auto md:p-8">
<p id="showOptions" class="cursor-pointer underline underline-offset-3 decoration-8 decoration-blue-600 mb-4 text-4xl font-extrabold leading-none tracking-tight text-gray-900 md:text-5xl lg:text-6xl">Options:</p>
<div id="showOptionsContent" class="max-h-[0] overflow-hidden relative [transition:max-height_0.6s_ease-in-out] pt-4">
<label for="combine_imports" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="combine_imports" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Combine Import statements</span>
</label>
<label for="remove_pass" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="remove_pass" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Remove Pass statements</span>
</label>
<label for="remove_literal_statements" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="remove_literal_statements" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Remove literal statements (docstrings)</span>
</label>
<label for="remove_annotations" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="remove_annotations" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Remove Annotations</span>
</label>
<label for="hoist_literals" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="hoist_literals" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Hoist Literals</span>
</label>
<label for="rename_locals" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="rename_locals" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Rename Locals</span>
</label>
<label for="rename_globals" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="rename_globals" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Rename Globals</span>
</label>
<label for="convert_posargs_to_args" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="convert_posargs_to_args" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Convert Positional-Only to Normal Args</span>
</label>
<label for="preserve_shebang" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="preserve_shebang" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Preserve any shebang line</span>
</label>
<label for="remove_asserts" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="remove_asserts" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Remove assert statements</span>
</label>
<label for="remove_debug" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="remove_debug" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Remove if <span class="font-bold pr-1 pl-1">__debug__</span>being True </span>
</label>
<label for="remove_explicit_return_none" class="flex items-center mb-5 cursor-pointer pl-2">
<input type="checkbox" id="remove_explicit_return_none" class="sr-only peer">
<div class="absolute w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
<span class="cursor-pointer ml-2 text-neutral-500 text-lg font-medium pl-10">Remove unnecessary returns</span>
</label>
<div class="relative mb-3">
<input type="text" id="preserve_locals" class="block rounded-lg px-2.5 pb-2.5 pt-5 w-full text-sm text-gray-900 bg-gray-50 border-0 border-b-2 border-gray-300 appearance-none focus:outline-none focus:ring-0 peer" placeholder=" " spellcheck="false" />
<label for="preserve_locals" class="absolute cursor-text text-bold text-gray-500 duration-300 transform -translate-y-4 scale-75 top-4 z-10 origin-[0] start-2.5 peer-focus:text-blue-600 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-4 rtl:peer-focus:translate-x-1/4 rtl:peer-focus:left-auto">Preserved Locals:</label>
</div>
<div class="relative mb-2">
<input type="text" id="preserve_globals" class="block rounded-lg px-2.5 pb-2.5 pt-5 w-full text-sm text-gray-900 bg-gray-50 border-0 border-b-2 border-gray-300 appearance-none focus:outline-none focus:ring-0 peer" placeholder=" " spellcheck="false" />
<label for="preserve_globals" class="absolute cursor-text text-bold text-gray-500 duration-300 transform -translate-y-4 scale-75 top-4 z-10 origin-[0] start-2.5 peer-focus:text-blue-600 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-4 rtl:peer-focus:translate-x-1/4 rtl:peer-focus:left-auto">Preserved Globals:</label>
</div>
<p class="text-sm mb-2 text-neutral-500">
<span class="text-red-500">^</span> Delimiter is comma
</p>
<a class="text-blue-500 text-base hover:underline hover:text-blue-600" href="https://dflook.github.io/python-minifier/transforms" target="_blank" rel="noopener noreferrer">Learn More <i class="fa-solid fa-arrow-up-right-from-square fa-sm"></i>
</a>
<div class="mt-4 space-x-2 text-center">
<button id="selectall" class="px-4 py-2 mt-2 font-bold cursor-pointer bg-green-500 rounded text-white hover:bg-green-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100">Select all</button>
<button id="resetOpt" class="px-4 py-2 mt-2 font-bold cursor-pointer bg-red-500 rounded text-white hover:bg-red-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100">Reset</button>
</div>
</div>
</div>
<div class="mb-2 md:mb-4 text-center">
<span id="minify" class="relative rounded cursor-pointer pt-5 p-4 overflow-hidden group bg-blue-500 hover:bg-gradient-to-r hover:from-blue-500 hover:to-blue-400 text-white hover:ring-2 hover:ring-offset-2 hover:ring-blue-400 transition-all ease-out duration-300 z-0">
<span class="absolute right-0 w-8 h-40 -mt-12 transition-all duration-1000 transform translate-x-12 bg-white opacity-10 rotate-12 group-hover:-translate-x-40 ease"></span>
<span class="relative font-bold text-2xl">Minify <i id="fade-0" class="fa-solid fa-down-left-and-up-right-to-center fa-sm"></i>
</span>
</span>
<button id="minifyAll" disabled class="hidden px-3 py-2 ml-2 font-bold cursor-pointer bg-blue-500 rounded-full text-white hover:bg-blue-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100 z-10"> 5+ </button>
</div>
<div id="overlay" class="fixed top-0 left-0 w-full h-full bg-black bg-opacity-50 z-50 hidden transition-opacity duration-2000"></div>
<div id="popup" class="fixed top-1/2 left-1/2 colorhandle transform -translate-x-1/2 -translate-y-1/2 bg-white p-8 rounded shadow-md z-50 hidden transition-transform duration-2000">
<div id="downloadLink" class="text-center">
<span id="fileLink-load"></span>
<label id="copy-msg" for="fileLink" class="cursor-pointer block mb-2 text-lg text-neutral-500 font-medium"></label>
<div class="relative flex justify-center items-center">
<input type="text" id="fileLink" class="cursor-text border border-gray-300 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-51 p-2.5 mr-1" readonly>
<a id="new_tab"></a>
</div>
<div id="help-msg" class="help-container text-left" oncontextmenu="return false"></div>
<span id="scantocopy"></span>
<div id="qrCode" oncontextmenu="return false;"></div>
<div class="flex flex-col">
<button id="downloadLinkurl" download class="hidden self-center w-fit px-4 py-2 mt-2 font-bold bg-green-500 rounded-lg text-white hover:bg-green-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100"></button>
<button id="closePopup" class="hidden px-4 py-2 self-center mt-5 font-bold bg-red-500 rounded-full w-fit text-white hover:bg-red-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100">Close</button>
</div>
</div>
</div>
<h2 class="relative text-2xl font-bold mt-8 mb-5 text-white bg-black block rounded py-6 pl-[15px] [box-shadow:0_0_2px_rgb(0_0_0/30%)] [border-left:5px_solid_#ef4444]">Minified Code</h2>
<div class="text-left">
<span id="line-count-out" class="font-bold px-4 py-2 bg-red-500 rounded text-white">Lines: 1</span>
<span id="minified-size" class="font-bold px-4 py-2 bg-red-500 rounded text-white">0.000 kB</span>
</div>
<div class="flex items-center">
<div id="tabs-overlay-out" class="hidden cursor-default absolute h-20 z-10 left-[1vh] right-[1vh] bg-transparent"></div>
<ul id="file-tabs-out" class="list-none pr-px mr-1 [scrollbar-width:thin] pt-3 whitespace-nowrap inline-flex overflow-x-auto colorhandle">
<li class="file-tab-out relative cursor-pointer bg-[#f0f0f0] border-[#ccc] px-[25px] py-2 mb-[5px] border border-solid rounded mr-[5px] transition-opacity active" id="file-out-1">
<i class="fa-solid fa-file-code text-blue-600 pr-2"></i>File 1.py
</li>
</ul>
</div>
<div id="minified" class="w-auto h-[300px] mt-0.5 rounded overflow-hidden border border-solid border-[#cccccc8f] [border-left:6px_solid_rgba(0,_83,_159,_0.65)]"></div>
<div id="btns-overlay" class="hidden cursor-default absolute h-28 z-10 left-[1vh] right-[1vh] bg-transparent"></div>
<div class="flex flex-col mb-2 md:mb-4">
<div class="flex flex-wrap justify-center lg:justify-start gap-0.5 mt-3">
<div class="flex flex-wrap justify-center gap-[3px] md:gap-1">
<button id="dw" disabled class="px-4 py-2 mt-2 font-bold cursor-pointer bg-red-500 rounded text-white hover:bg-red-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100">Download <i id="fade-1" class="fa-solid fa-download"></i>
</button>
<button id="copy" disabled class="px-4 py-2 mt-2 font-bold cursor-pointer bg-green-500 rounded text-white hover:bg-green-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100">Copy <i class="fa-solid fa-clipboard"></i>
</button>
<button id="share" disabled class="px-4 py-2 mt-2 mr-0.5 font-bold cursor-pointer bg-blue-500 rounded text-white hover:bg-blue-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100">Share <i id="fade-2" class="fa-solid fa-share-from-square"></i>
</button>
</div>
<button id="diffPopup" class="hidden md:block mr-0.5 px-4 py-2 mt-2 font-bold cursor-pointer bg-orange-500 rounded text-white hover:bg-orange-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100">Compare <i id="fade-10" class="fa-solid fa-code-compare"></i>
</button>
<button id="runCode" class="sm:w-auto px-4 py-2 font-bold cursor-pointer bg-purple-500 rounded text-white hover:bg-purple-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100 mt-2">Run Code <i id="fade-9" class="fa-regular fa-circle-play"></i>
</button>
</div>
<div id="comProgress" class="hidden colorhandle mt-2 w-full sm:w-auto">
<progress id="comProgressBar" max="100" value="0" class="w-full h-2"></progress>
<p id="comProgressStatus" class="mt-2 text-base"></p>
</div>
</div>
</div>
<div id="pyterminal" class="hidden mx-4 md:mx-auto md:max-w-2xl lg:max-w-4xl xl:max-w-6xl p-4 md:p-8 bg-white mt-8 mb-8 rounded-lg shadow max-h-[420px]">
<div class="flex items-center">
<h4 class="text-2xl font-bold from-blue-600 via-blue-400 to-blue-500 bg-gradient-to-r bg-clip-text text-transparent mb-2">
<i class="fa-brands fa-python"></i> Python Compiler
</h4>
<div class="hidden md:block">
<div class="flex ml-2 relative bottom-5 text-sm cursor-pointer space-x-2 font-semibold">
<div class="help-container !left-0 mr-2" oncontextmenu="return false">
<i class="fas fa-question-circle text-gray-400"></i>
<div class="help-content absolute cursor-default rounded-lg bg-white !w-96 shadow-md text-sm">
<ol class="text-gray-700 list-decimal list-inside">
<li>The maximum execution time is 5 seconds.</li>
<li>Code will be compiled only after minification.</li>
<li>Avoid using sensitive or proprietary code due to potential exposure.</li>
<li>Be aware of any restrictions on file I/O, libraries, or Write permissions</li>
<li>Consider that online compilers might have slower execution times compared to local setups.</li>
<li>Inputs won't work.</li>
</ol>
</div>
</div>
</div>
</div>
</div>
<pre id="terminaltext" class="select-text font-mono text-xs lg:text-sm max-h-[295px] overflow-auto p-3 rounded [scrollbar-width:thin] colorhandle"></pre>
<button id="closeCompiler" class="cursor-pointer mt-1.5 pl-2 font-semibold text-red-500 hover:underline">Close</button>
<button id="copyCompilertext" class="cursor-pointer mt-1.5 pl-2 font-semibold text-green-500 hover:underline">Copy</button>
<button id="exportCompilertext" class="cursor-pointer mt-1.5 pl-2 font-semibold text-blue-500 hover:underline">Export</button>
</div>
<div id="graph-container" class="hidden font-['Source_Code_Pro'] mx-4 md:mx-auto md:max-w-2xl lg:max-w-4xl xl:max-w-6xl p-4 md:p-8 bg-white mt-8 mb-8 rounded-lg shadow">
<h4 class="text-2xl font-bold from-blue-600 via-blue-400 to-blue-500 bg-gradient-to-r bg-clip-text text-transparent mb-2 font-sans">
<i class="fa-solid fa-chart-line"></i> Visualization
</h4>
<div id="line-graph"></div>
<p class="text-sm mb-2 text-neutral-500 font-sans font-medium">Minify to update</p>
<div class="text-center space-x-1">
<button id="graphkbsize" class="px-4 py-2 mt-2 font-bold cursor-pointer bg-green-500 rounded text-white hover:bg-green-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100">Size</button>
<button id="graphlines" class="px-4 py-2 mt-2 font-bold cursor-pointer bg-blue-500 rounded text-white hover:bg-blue-600 ease-out overflow-hidden transform md:hover:scale-x-105 md:hover:scale-y-100">Lines</button>
</div>
</div>
<div class="relative">
<div id="diff-popup" class="fixed inset-0 bg-black bg-opacity-50 items-center justify-center hidden z-50">
<div id="diff-popup-content" class="relative w-[90%] h-[90%] bg-white rounded shadow-lg overflow-hidden transform scale-90 opacity-0 transition-opacity duration-300 z-60">
<div class="flex items-center pl-1 mx-2">
<ul id="diff-tabs" class="mb-2.5 overflow-x-auto [scrollbar-width:thin] pr-px mr-1 pt-3 inline-flex text-nowrap colorhandle"></ul>
<div class="flex flex-col ml-auto">
<label for="diff-text-wrap" class="flex items-center self-center cursor-pointer pl-2">
<input type="checkbox" id="diff-text-wrap" class="sr-only peer">
<div class="relative w-9 h-5 bg-gray-600 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-green-600"></div>
</label>
<span class="cursor-pointer text-neutral-500 pl-2 font-medium text-center text-xs">Line Wrap</span>
</div>
</div>
<div id="diff-editor" class="h-full w-full"></div>
</div>
</div>
<button id="close-diff-popup" class="fixed hidden top-4 right-4 bg-red-500 text-white rounded-full w-8 h-8 items-center justify-center text-xl cursor-pointer hover:bg-red-600 focus:outline-none z-[70]" title="Close Diff Editor">
<i id="fade-11" class="fa-solid fa-xmark"></i>
</button>
</div>
<div class="flex justify-center items-center pb-[25px]">
<div class="bg-white rounded-lg shadow-lg p-6 flex flex-col md:flex-row md:items-center">
<div class="mb-6 md:mb-0 md:mr-6">
<p class="font-extrabold font-['Source_Code_Pro'] text-center tracking-wide uppercase colorhandle">Share it on..</p>
</div>
<div class="flex flex-wrap justify-center">
<a href="whatsapp://send?text=Check%20out%20this%20python%20minifier!!%20https://glad432.github.io/" target="_blank" rel="noopener noreferrer" class="text-green-500 mx-2 my-2" title="Share on WhatsApp">
<i class="fab fa-whatsapp fa-2x transition-transform transform hover:-translate-y-2"></i>
</a>
<a href="https://telegram.me/share/url?url=https://glad432.github.io/&text=Check%20out%20this%20python%20minifier!!" target="_blank" rel="noopener noreferrer" class="text-blue-500 mx-2 my-2" title="Share on Telegram">
<i class="fab fa-telegram-plane fa-2x transition-transform transform hover:-translate-y-2"></i>
</a>
<a href="https://www.facebook.com/sharer/sharer.php?u=https://glad432.github.io/" target="_blank" rel="noopener noreferrer" class="text-blue-700 mx-2 my-2" title="Share on Facebook">
<i class="fab fa-facebook fa-2x transition-transform transform hover:-translate-y-2"></i>
</a>
<a href="https://x.com/intent/post?url=https://glad432.github.io/&text=Check%20out%20this%20python%20minifier!!" target="_blank" rel="noopener noreferrer" class="text-slate-600 mx-2 my-2" title="Share on X">
<i class="fab fa-x-twitter fa-2x transition-transform transform hover:-translate-y-2"></i>
</a>
<a href="https://www.reddit.com/submit?url=https://glad432.github.io/&title=Check%20out%20this%20python%20minifier!!" target="_blank" rel="noopener noreferrer" class="text-red-500 mx-2 my-2" title="Share on Reddit">
<i class="fab fa-reddit fa-2x transition-transform transform hover:-translate-y-2"></i>
</a>
</div>
</div>
</div>
<div class="grid place-items-center">
<span id="show-btn" class="relative cursor-pointer text-center text-white bg-gray-700 hover:bg-gray-800 focus:outline-none focus:ring-4 focus:ring-gray-300 font-medium rounded-full text-sm px-5 py-2.5">Learn More <i id="rot-1" class="fa-solid fa-caret-down"></i>
</span>
</div>
<article id="article" class="font-['Source_Code_Pro'] colorhandle select-text mx-4 md:mx-auto md:max-w-2xl lg:max-w-4xl xl:max-w-6xl p-4 md:p-8 mt-8 mb-8 transition-all duration-100 ease-in-out"></article>
<footer class="bg-black text-xs md:text-sm text-center text-white">
<div class="pt-9">
<div class="mb-9 flex justify-center">
<a href="https://gladw-in.github.io/" target="_blank" rel="noopener noreferrer" class="mr-9 text-neutral-200 hover:text-blue-700">
<i class="fa-solid fa-globe fa-xl"></i>
</a>
<a href="https://www.linkedin.com/in/glad432/" target="_blank" rel="noopener noreferrer" class="mr-9 text-neutral-200 hover:text-blue-700">
<i class="fa-brands fa-linkedin fa-xl"></i>
</a>
<a href="https://github.com/gladw-in" target="_blank" rel="noopener noreferrer" class="text-neutral-200 hover:text-blue-700">
<i class="fa-brands fa-github fa-xl"></i>
</a>
</div>
</div>
<div class="p-4 text-center bg-neutral-700 text-neutral-200">© GLAD432 <span id="year" class="text-neutral-400"></span>
<span class="text-neutral-400">All Rights Reserved</span>
</div>
</footer>
<script type="module" src="js/script.js"></script>
<script src="https://cdn.jsdelivr.net/npm/apexcharts@3.53.0/dist/apexcharts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/monaco-editor@0.51.0/min/vs/loader.js"></script>
</body>
</html>