Hugging Face's logo

Spaces:
En3rGy
/
test
Build error

App Files Community
En3rGy commited on
Commit
220d371
·
verified ·
1 Parent(s): 6883e37

Delete index.nopehtml

Browse files
Files changed (1) hide show
  1. index.nopehtml +0 -889
index.nopehtml DELETED
@@ -1,889 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>NSFW Image to Text Generator</title>
7
- <script src="https://cdn.tailwindcss.com"></script>
8
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
- <style>
10
- .nsfw-toggle {
11
- position: relative;
12
- width: 60px;
13
- height: 30px;
14
- -webkit-appearance: none;
15
- background: #c6c6c6;
16
- outline: none;
17
- border-radius: 20px;
18
- box-shadow: inset 0 0 5px rgba(0,0,0,.2);
19
- transition: .5s;
20
- }
21
- .nsfw-toggle:checked {
22
- background: #ff4081;
23
- }
24
- .nsfw-toggle:before {
25
- content: '';
26
- position: absolute;
27
- width: 30px;
28
- height: 30px;
29
- border-radius: 20px;
30
- top: 0;
31
- left: 0;
32
- background: #fff;
33
- transform: scale(1.1);
34
- box-shadow: 0 2px 5px rgba(0,0,0,.2);
35
- transition: .5s;
36
- }
37
- .nsfw-toggle:checked:before {
38
- left: 30px;
39
- }
40
- .dropzone {
41
- border: 2px dashed #9ca3af;
42
- border-radius: 0.5rem;
43
- transition: all 0.3s ease;
44
- }
45
- .dropzone.active {
46
- border-color: #3b82f6;
47
- background-color: rgba(59, 130, 246, 0.05);
48
- }
49
- .tag-bubble {
50
- display: inline-flex;
51
- align-items: center;
52
- background-color: #e5e7eb;
53
- border-radius: 9999px;
54
- padding: 0.25rem 0.75rem;
55
- margin-right: 0.5rem;
56
- margin-bottom: 0.5rem;
57
- }
58
- .tag-bubble button {
59
- margin-left: 0.5rem;
60
- color: #6b7280;
61
- }
62
- .tag-bubble button:hover {
63
- color: #ef4444;
64
- }
65
- .output-area {
66
- min-height: 200px;
67
- border: 1px solid #e5e7eb;
68
- border-radius: 0.5rem;
69
- background-color: #f9fafb;
70
- }
71
- .tab-active {
72
- border-bottom: 3px solid #3b82f6;
73
- color: #3b82f6;
74
- font-weight: 600;
75
- }
76
- .model-card {
77
- transition: all 0.3s ease;
78
- border: 1px solid #e5e7eb;
79
- }
80
- .model-card:hover {
81
- transform: translateY(-2px);
82
- box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
83
- }
84
- .model-card.selected {
85
- border-color: #3b82f6;
86
- background-color: rgba(59, 130, 246, 0.05);
87
- }
88
- </style>
89
- </head>
90
- <body class="bg-gray-50 min-h-screen">
91
- <div class="container mx-auto px-4 py-8">
92
- <header class="mb-8">
93
- <div class="flex justify-between items-center">
94
- <h1 class="text-3xl font-bold text-gray-800">
95
- <i class="fas fa-image mr-2 text-blue-500"></i> NSFW Image to Text Generator
96
- </h1>
97
- <div class="flex items-center">
98
- <span class="mr-2 text-sm font-medium text-gray-700">NSFW Mode</span>
99
- <label class="relative inline-block w-14 h-8">
100
- <input type="checkbox" id="nsfwToggle" class="opacity-0 w-0 h-0">
101
- <span class="slider round absolute cursor-pointer top-0 left-0 right-0 bottom-0 bg-gray-300 transition duration-300 rounded-full before:absolute before:content-[''] before:h-6 before:w-6 before:left-1 before:bottom-1 before:bg-white before:transition before:duration-300 before:rounded-full"></span>
102
- </label>
103
- </div>
104
- </div>
105
- <p class="text-gray-600 mt-2">Generate detailed descriptions, captions, tags, and prompts from your images with AI</p>
106
- </header>
107
-
108
- <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
109
- <!-- Left Column - Input Section -->
110
- <div class="lg:col-span-1 bg-white rounded-lg shadow p-6">
111
- <h2 class="text-xl font-semibold mb-4 text-gray-800">
112
- <i class="fas fa-upload mr-2 text-blue-500"></i> Upload Image
113
- </h2>
114
-
115
- <!-- Image Dropzone -->
116
- <div id="dropzone" class="dropzone flex flex-col items-center justify-center p-8 mb-6 cursor-pointer">
117
- <i class="fas fa-cloud-upload-alt text-4xl text-gray-400 mb-3"></i>
118
- <p class="text-gray-500 mb-2">Drag & drop your image here</p>
119
- <p class="text-gray-400 text-sm mb-4">or</p>
120
- <label for="fileInput" class="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded cursor-pointer transition">
121
- Select Image
122
- </label>
123
- <input type="file" id="fileInput" class="hidden" accept="image/*">
124
- </div>
125
- <div id="imagePreviewContainer" class="hidden mb-6">
126
- <img id="imagePreview" class="max-w-full h-auto rounded-lg shadow" src="" alt="Preview">
127
- </div>
128
-
129
- <!-- Settings Section -->
130
- <div class="mb-6">
131
- <h3 class="font-medium text-gray-700 mb-3">
132
- <i class="fas fa-cog mr-2 text-blue-500"></i> Generation Settings
133
- </h3>
134
-
135
- <div class="space-y-4">
136
- <div>
137
- <label class="block text-sm font-medium text-gray-700 mb-1">Output Type</label>
138
- <select id="outputType" class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500">
139
- <option value="description">Detailed Description</option>
140
- <option value="caption">Short Caption</option>
141
- <option value="tags">Tag List</option>
142
- <option value="prompt">AI Prompt</option>
143
- <option value="training">Model Training Data</option>
144
- </select>
145
- </div>
146
-
147
- <div>
148
- <label class="block text-sm font-medium text-gray-700 mb-1">Style</label>
149
- <select id="styleSelect" class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500">
150
- <option value="neutral">Neutral</option>
151
- <option value="erotic">Erotic</option>
152
- <option value="artistic">Artistic</option>
153
- <option value="technical">Technical</option>
154
- <option value="literary">Literary</option>
155
- <option value="bdsm">BDSM</option>
156
- <option value="fetish">Fetish</option>
157
- </select>
158
- </div>
159
-
160
- <div>
161
- <label class="block text-sm font-medium text-gray-700 mb-1">Detail Level</label>
162
- <div class="flex items-center">
163
- <input type="range" id="detailLevel" min="1" max="5" value="3" class="w-full">
164
- <span id="detailValue" class="ml-2 text-sm text-gray-600">3</span>
165
- </div>
166
- </div>
167
-
168
- <div id="nsfwOptions" class="hidden">
169
- <label class="block text-sm font-medium text-gray-700 mb-1">NSFW Focus</label>
170
- <div class="flex flex-wrap gap-2">
171
- <button class="nsfw-option-btn px-3 py-1 text-sm rounded-full border border-gray-300 hover:bg-gray-100" data-value="general">General</button>
172
- <button class="nsfw-option-btn px-3 py-1 text-sm rounded-full border border-gray-300 hover:bg-gray-100" data-value="body">Body Details</button>
173
- <button class="nsfw-option-btn px-3 py-1 text-sm rounded-full border border-gray-300 hover:bg-gray-100" data-value="pose">Pose</button>
174
- <button class="nsfw-option-btn px-3 py-1 text-sm rounded-full border border-gray-300 hover:bg-gray-100" data-value="clothing">Clothing</button>
175
- <button class="nsfw-option-btn px-3 py-1 text-sm rounded-full border border-gray-300 hover:bg-gray-100" data-value="fetish">Fetish</button>
176
- </div>
177
- </div>
178
- </div>
179
- </div>
180
-
181
- <!-- Custom Tags Section -->
182
- <div class="mb-6">
183
- <h3 class="font-medium text-gray-700 mb-3">
184
- <i class="fas fa-tags mr-2 text-blue-500"></i> Custom Tags
185
- </h3>
186
- <div class="flex mb-2">
187
- <input type="text" id="tagInput" placeholder="Add custom tags" class="flex-1 border border-gray-300 rounded-l-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500">
188
- <button id="addTagBtn" class="bg-blue-500 hover:bg-blue-600 text-white px-3 py-2 rounded-r-md transition">
189
- Add
190
- </button>
191
- </div>
192
- <div id="tagsContainer" class="flex flex-wrap"></div>
193
- </div>
194
-
195
- <!-- Model Selection -->
196
- <div class="mb-6">
197
- <h3 class="font-medium text-gray-700 mb-3">
198
- <i class="fas fa-brain mr-2 text-blue-500"></i> AI Model
199
- </h3>
200
- <div class="grid grid-cols-2 gap-2">
201
- <div class="model-card p-3 rounded cursor-pointer" data-model="clip">
202
- <div class="font-medium">CLIP</div>
203
- <div class="text-xs text-gray-500">General purpose</div>
204
- </div>
205
- <div class="model-card p-3 rounded cursor-pointer" data-model="blip">
206
- <div class="font-medium">BLIP</div>
207
- <div class="text-xs text-gray-500">Detailed descriptions</div>
208
- </div>
209
- <div class="model-card p-3 rounded cursor-pointer" data-model="deepdanbooru">
210
- <div class="font-medium">DeepDanbooru</div>
211
- <div class="text-xs text-gray-500">Anime tagging</div>
212
- </div>
213
- <div class="model-card p-3 rounded cursor-pointer" data-model="nsfw-detector">
214
- <div class="font-medium">NSFW Detector</div>
215
- <div class="text-xs text-gray-500">Explicit content</div>
216
- </div>
217
- </div>
218
- </div>
219
-
220
- <!-- Generate Button -->
221
- <button id="generateBtn" class="w-full bg-blue-500 hover:bg-blue-600 text-white font-medium py-3 px-4 rounded-md transition flex items-center justify-center">
222
- <i class="fas fa-magic mr-2"></i> Generate Text
223
- </button>
224
- </div>
225
-
226
- <!-- Middle Column - Output Section -->
227
- <div class="lg:col-span-2 bg-white rounded-lg shadow p-6">
228
- <div class="flex border-b mb-4">
229
- <button class="tab-btn px-4 py-2 font-medium text-gray-600 hover:text-blue-500 tab-active" data-tab="output">
230
- <i class="fas fa-file-alt mr-2"></i> Output
231
- </button>
232
- <button class="tab-btn px-4 py-2 font-medium text-gray-600 hover:text-blue-500" data-tab="prompt">
233
- <i class="fas fa-keyboard mr-2"></i> Prompt Tools
234
- </button>
235
- <button class="tab-btn px-4 py-2 font-medium text-gray-600 hover:text-blue-500" data-tab="training">
236
- <i class="fas fa-graduation-cap mr-2"></i> Training Data
237
- </button>
238
- </div>
239
-
240
- <!-- Output Tab -->
241
- <div id="outputTab" class="tab-content">
242
- <div class="flex justify-between items-center mb-4">
243
- <h3 class="text-lg font-medium text-gray-800">Generated Output</h3>
244
- <div class="flex space-x-2">
245
- <button id="copyOutputBtn" class="text-gray-500 hover:text-gray-700 p-1 rounded">
246
- <i class="fas fa-copy"></i> Copy
247
- </button>
248
- <button id="downloadOutputBtn" class="text-gray-500 hover:text-gray-700 p-1 rounded">
249
- <i class="fas fa-download"></i> Download
250
- </button>
251
- <button id="clearOutputBtn" class="text-gray-500 hover:text-gray-700 p-1 rounded">
252
- <i class="fas fa-trash"></i> Clear
253
- </button>
254
- </div>
255
- </div>
256
- <div id="outputArea" class="output-area p-4 mb-4">
257
- <p class="text-gray-500 italic">Your generated text will appear here...</p>
258
- </div>
259
-
260
- <div class="flex space-x-2">
261
- <button id="enhanceBtn" class="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded transition">
262
- <i class="fas fa-wand-magic-sparkles mr-2"></i> Enhance
263
- </button>
264
- <button id="shortenBtn" class="bg-gray-200 hover:bg-gray-300 text-gray-800 px-4 py-2 rounded transition">
265
- <i class="fas fa-compress mr-2"></i> Shorten
266
- </button>
267
- <button id="rewriteBtn" class="bg-gray-200 hover:bg-gray-300 text-gray-800 px-4 py-2 rounded transition">
268
- <i class="fas fa-pen-fancy mr-2"></i> Rewrite
269
- </button>
270
- </div>
271
- </div>
272
-
273
- <!-- Prompt Tools Tab -->
274
- <div id="promptTab" class="tab-content hidden">
275
- <h3 class="text-lg font-medium text-gray-800 mb-4">Prompt Enhancement Tools</h3>
276
-
277
- <div class="mb-6">
278
- <h4 class="font-medium text-gray-700 mb-2">Prompt Builder</h4>
279
- <textarea id="promptInput" class="w-full border border-gray-300 rounded-md px-3 py-2 h-32 focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter your base prompt here..."></textarea>
280
- <div class="flex flex-wrap gap-2 mt-2">
281
- <button class="prompt-tool-btn bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded" data-tool="artist">Add Artist</button>
282
- <button class="prompt-tool-btn bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded" data-tool="style">Add Style</button>
283
- <button class="prompt-tool-btn bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded" data-tool="lighting">Add Lighting</button>
284
- <button class="prompt-tool-btn bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded" data-tool="composition">Add Composition</button>
285
- <button class="prompt-tool-btn bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded" data-tool="nsfw">Add NSFW</button>
286
- </div>
287
- </div>
288
-
289
- <div class="mb-6">
290
- <h4 class="font-medium text-gray-700 mb-2">Prompt Optimizer</h4>
291
- <div class="flex space-x-2 mb-2">
292
- <button id="optimizePromptBtn" class="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded transition">
293
- Optimize Prompt
294
- </button>
295
- <button id="randomizePromptBtn" class="bg-gray-200 hover:bg-gray-300 text-gray-800 px-4 py-2 rounded transition">
296
- Randomize
297
- </button>
298
- </div>
299
- <div id="optimizedPrompt" class="border border-gray-300 rounded-md p-4 bg-gray-50 min-h-32">
300
- <p class="text-gray-500 italic">Optimized prompt will appear here...</p>
301
- </div>
302
- </div>
303
-
304
- <div>
305
- <h4 class="font-medium text-gray-700 mb-2">Negative Prompt Builder</h4>
306
- <textarea id="negativePromptInput" class="w-full border border-gray-300 rounded-md px-3 py-2 h-24 focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter negative prompts here..."></textarea>
307
- <div class="flex flex-wrap gap-2 mt-2">
308
- <button class="negative-tool-btn bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded" data-tool="quality">Quality Issues</button>
309
- <button class="negative-tool-btn bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded" data-tool="anatomy">Anatomy</button>
310
- <button class="negative-tool-btn bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded" data-tool="nsfw">NSFW Limits</button>
311
- <button class="negative-tool-btn bg-gray-100 hover:bg-gray-200 px-3 py-1 rounded" data-tool="style">Style</button>
312
- </div>
313
- </div>
314
- </div>
315
-
316
- <!-- Training Data Tab -->
317
- <div id="trainingTab" class="tab-content hidden">
318
- <h3 class="text-lg font-medium text-gray-800 mb-4">Model Training Preparation</h3>
319
-
320
- <div class="mb-6">
321
- <h4 class="font-medium text-gray-700 mb-2">Training Tags</h4>
322
- <div id="trainingTags" class="border border-gray-300 rounded-md p-4 bg-gray-50 min-h-32 mb-4">
323
- <p class="text-gray-500 italic">Training tags will appear here...</p>
324
- </div>
325
- <div class="flex space-x-2">
326
- <button id="generateTagsBtn" class="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded transition">
327
- Generate Tags
328
- </button>
329
- <button id="formatTagsBtn" class="bg-gray-200 hover:bg-gray-300 text-gray-800 px-4 py-2 rounded transition">
330
- Format for Training
331
- </button>
332
- </div>
333
- </div>
334
-
335
- <div class="mb-6">
336
- <h4 class="font-medium text-gray-700 mb-2">Caption Generation</h4>
337
- <div class="flex items-center mb-2">
338
- <select id="captionStyle" class="border border-gray-300 rounded-md px-3 py-2 mr-2 focus:outline-none focus:ring-2 focus:ring-blue-500">
339
- <option value="basic">Basic Caption</option>
340
- <option value="detailed">Detailed Description</option>
341
- <option value="booru">Booru Style</option>
342
- <option value="natural">Natural Language</option>
343
- </select>
344
- <button id="generateCaptionBtn" class="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded transition">
345
- Generate Caption
346
- </button>
347
- </div>
348
- <div id="trainingCaption" class="border border-gray-300 rounded-md p-4 bg-gray-50 min-h-32">
349
- <p class="text-gray-500 italic">Training caption will appear here...</p>
350
- </div>
351
- </div>
352
-
353
- <div>
354
- <h4 class="font-medium text-gray-700 mb-2">LoRA Training Preparation</h4>
355
- <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
356
- <div>
357
- <label class="block text-sm font-medium text-gray-700 mb-1">Trigger Word</label>
358
- <input type="text" id="triggerWord" class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="e.g., mycharacter">
359
- </div>
360
- <div>
361
- <label class="block text-sm font-medium text-gray-700 mb-1">Class</label>
362
- <input type="text" id="classWord" class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="e.g., woman, man, person">
363
- </div>
364
- </div>
365
- <button id="prepareLoraBtn" class="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded transition">
366
- Prepare LoRA Training Data
367
- </button>
368
- </div>
369
- </div>
370
- </div>
371
- </div>
372
- </div>
373
-
374
- <script>
375
- // DOM Elements
376
- const dropzone = document.getElementById('dropzone');
377
- const fileInput = document.getElementById('fileInput');
378
- const imagePreviewContainer = document.getElementById('imagePreviewContainer');
379
- const imagePreview = document.getElementById('imagePreview');
380
- const nsfwToggle = document.getElementById('nsfwToggle');
381
- const nsfwOptions = document.getElementById('nsfwOptions');
382
- const outputType = document.getElementById('outputType');
383
- const detailLevel = document.getElementById('detailLevel');
384
- const detailValue = document.getElementById('detailValue');
385
- const tagInput = document.getElementById('tagInput');
386
- const addTagBtn = document.getElementById('addTagBtn');
387
- const tagsContainer = document.getElementById('tagsContainer');
388
- const generateBtn = document.getElementById('generateBtn');
389
- const outputArea = document.getElementById('outputArea');
390
- const copyOutputBtn = document.getElementById('copyOutputBtn');
391
- const downloadOutputBtn = document.getElementById('downloadOutputBtn');
392
- const clearOutputBtn = document.getElementById('clearOutputBtn');
393
- const enhanceBtn = document.getElementById('enhanceBtn');
394
- const shortenBtn = document.getElementById('shortenBtn');
395
- const rewriteBtn = document.getElementById('rewriteBtn');
396
- const tabBtns = document.querySelectorAll('.tab-btn');
397
- const tabContents = document.querySelectorAll('.tab-content');
398
- const modelCards = document.querySelectorAll('.model-card');
399
- const nsfwOptionBtns = document.querySelectorAll('.nsfw-option-btn');
400
-
401
- // Event Listeners
402
- dropzone.addEventListener('dragover', (e) => {
403
- e.preventDefault();
404
- dropzone.classList.add('active');
405
- });
406
-
407
- dropzone.addEventListener('dragleave', () => {
408
- dropzone.classList.remove('active');
409
- });
410
-
411
- dropzone.addEventListener('drop', (e) => {
412
- e.preventDefault();
413
- dropzone.classList.remove('active');
414
-
415
- if (e.dataTransfer.files.length) {
416
- fileInput.files = e.dataTransfer.files;
417
- handleFileUpload(e.dataTransfer.files[0]);
418
- }
419
- });
420
-
421
- fileInput.addEventListener('change', () => {
422
- if (fileInput.files.length) {
423
- handleFileUpload(fileInput.files[0]);
424
- }
425
- });
426
-
427
- nsfwToggle.addEventListener('change', () => {
428
- if (nsfwToggle.checked) {
429
- nsfwOptions.classList.remove('hidden');
430
- } else {
431
- nsfwOptions.classList.add('hidden');
432
- }
433
- });
434
-
435
- detailLevel.addEventListener('input', () => {
436
- detailValue.textContent = detailLevel.value;
437
- });
438
-
439
- addTagBtn.addEventListener('click', addTag);
440
- tagInput.addEventListener('keypress', (e) => {
441
- if (e.key === 'Enter') {
442
- addTag();
443
- }
444
- });
445
-
446
- generateBtn.addEventListener('click', generateText);
447
- copyOutputBtn.addEventListener('click', copyOutput);
448
- downloadOutputBtn.addEventListener('click', downloadOutput);
449
- clearOutputBtn.addEventListener('click', clearOutput);
450
- enhanceBtn.addEventListener('click', enhanceOutput);
451
- shortenBtn.addEventListener('click', shortenOutput);
452
- rewriteBtn.addEventListener('click', rewriteOutput);
453
-
454
- tabBtns.forEach(btn => {
455
- btn.addEventListener('click', () => {
456
- const tab = btn.getAttribute('data-tab');
457
- switchTab(tab);
458
- });
459
- });
460
-
461
- modelCards.forEach(card => {
462
- card.addEventListener('click', () => {
463
- modelCards.forEach(c => c.classList.remove('selected'));
464
- card.classList.add('selected');
465
- });
466
- });
467
-
468
- nsfwOptionBtns.forEach(btn => {
469
- btn.addEventListener('click', () => {
470
- nsfwOptionBtns.forEach(b => b.classList.remove('bg-blue-500', 'text-white'));
471
- btn.classList.add('bg-blue-500', 'text-white');
472
- });
473
- });
474
-
475
- // Functions
476
- function handleFileUpload(file) {
477
- if (!file.type.match('image.*')) {
478
- alert('Please select an image file');
479
- return;
480
- }
481
-
482
- const reader = new FileReader();
483
- reader.onload = (e) => {
484
- imagePreview.src = e.target.result;
485
- imagePreviewContainer.classList.remove('hidden');
486
- };
487
- reader.readAsDataURL(file);
488
- }
489
-
490
- function addTag() {
491
- const tag = tagInput.value.trim();
492
- if (tag) {
493
- const tagElement = document.createElement('div');
494
- tagElement.className = 'tag-bubble';
495
- tagElement.innerHTML = `
496
- <span>${tag}</span>
497
- <button class="remove-tag" type="button">
498
- <i class="fas fa-times"></i>
499
- </button>
500
- `;
501
- tagsContainer.appendChild(tagElement);
502
- tagInput.value = '';
503
-
504
- tagElement.querySelector('.remove-tag').addEventListener('click', () => {
505
- tagElement.remove();
506
- });
507
- }
508
- }
509
-
510
- function generateText() {
511
- if (!imagePreview.src) {
512
- alert('Please upload an image first');
513
- return;
514
- }
515
-
516
- // Simulate API call with timeout
517
- outputArea.innerHTML = '<p class="text-gray-500 italic">Generating text... <i class="fas fa-spinner fa-spin"></i></p>';
518
-
519
- setTimeout(() => {
520
- const outputTypeValue = outputType.value;
521
- const isNSFW = nsfwToggle.checked;
522
- const detail = detailLevel.value;
523
- const style = document.getElementById('styleSelect').value;
524
-
525
- // Sample outputs based on settings
526
- let output = '';
527
-
528
- if (outputTypeValue === 'description') {
529
- output = generateDescription(isNSFW, detail, style);
530
- } else if (outputTypeValue === 'caption') {
531
- output = generateCaption(isNSFW, detail, style);
532
- } else if (outputTypeValue === 'tags') {
533
- output = generateTags(isNSFW, detail, style);
534
- } else if (outputTypeValue === 'prompt') {
535
- output = generatePrompt(isNSFW, detail, style);
536
- } else if (outputTypeValue === 'training') {
537
- output = generateTrainingData(isNSFW, detail, style);
538
- }
539
-
540
- outputArea.innerHTML = `<pre class="whitespace-pre-wrap">${output}</pre>`;
541
- }, 2000);
542
- }
543
-
544
- function generateDescription(isNSFW, detail, style) {
545
- let description = '';
546
-
547
- if (isNSFW) {
548
- description += "A high-quality NSFW image featuring ";
549
-
550
- if (style === 'erotic') {
551
- description += "an erotic scene with ";
552
- } else if (style === 'bdsm') {
553
- description += "a BDSM-themed composition showing ";
554
- } else if (style === 'fetish') {
555
- description += "a fetish-focused image depicting ";
556
- } else {
557
- description += "a sensual composition of ";
558
- }
559
-
560
- description += "a beautiful woman with ";
561
-
562
- if (detail >= 3) {
563
- description += "full, voluptuous curves, smooth skin, and ";
564
- if (detail >= 4) {
565
- description += "detailed anatomical features including perky breasts with ";
566
- if (detail >= 5) {
567
- description += "visible nipples and areola, a toned stomach, and ";
568
- }
569
- }
570
- }
571
-
572
- description += "an alluring pose. ";
573
-
574
- if (detail >= 2) {
575
- description += "She wears ";
576
- if (style === 'bdsm') {
577
- description += "restrictive leather harnesses and cuffs";
578
- } else if (style === 'fetish') {
579
- description += "specialized fetish attire";
580
- } else {
581
- description += "lingerie that accentuates her figure";
582
- }
583
- description += ". ";
584
- }
585
-
586
- if (detail >= 4) {
587
- description += "The lighting is soft and flattering, casting gentle shadows that highlight her form. ";
588
- if (detail >= 5) {
589
- description += "Subtle details like skin texture, fabric folds, and environmental elements add to the realism. ";
590
- }
591
- }
592
-
593
- description += "The composition is tasteful yet explicit, focusing on erotic appeal.";
594
- } else {
595
- description += "A high-quality image featuring ";
596
-
597
- if (style === 'artistic') {
598
- description += "an artistic composition with ";
599
- } else if (style === 'technical') {
600
- description += "a technically precise depiction of ";
601
- } else if (style === 'literary') {
602
- description += "a scene with narrative qualities showing ";
603
- } else {
604
- description += "a well-composed image of ";
605
- }
606
-
607
- description += "a person in ";
608
-
609
- if (detail >= 3) {
610
- description += "detailed clothing with visible textures, ";
611
- if (detail >= 4) {
612
- description += "expressive facial features, and ";
613
- if (detail >= 5) {
614
- description += "intricate background elements that add context. ";
615
- }
616
- }
617
- }
618
-
619
- description += "The lighting is ";
620
-
621
- if (detail >= 2) {
622
- description += "carefully balanced to highlight the subject, ";
623
- if (detail >= 4) {
624
- description += "with attention to shadow detail and color temperature. ";
625
- }
626
- }
627
-
628
- description += "The overall aesthetic is visually appealing and well-executed.";
629
- }
630
-
631
- return description;
632
- }
633
-
634
- function generateCaption(isNSFW, detail, style) {
635
- if (isNSFW) {
636
- let caption = "beautiful woman";
637
-
638
- if (style === 'erotic') {
639
- caption += ", erotic pose";
640
- } else if (style === 'bdsm') {
641
- caption += ", bdsm gear";
642
- } else if (style === 'fetish') {
643
- caption += ", fetish wear";
644
- }
645
-
646
- if (detail >= 3) {
647
- caption += ", detailed anatomy";
648
- if (detail >= 4) {
649
- caption += ", visible details";
650
- }
651
- }
652
-
653
- caption += ", high quality";
654
-
655
- return caption;
656
- } else {
657
- let caption = "person";
658
-
659
- if (style === 'artistic') {
660
- caption += ", artistic style";
661
- } else if (style === 'technical') {
662
- caption += ", technical precision";
663
- } else if (style === 'literary') {
664
- caption += ", narrative quality";
665
- }
666
-
667
- if (detail >= 3) {
668
- caption += ", detailed";
669
- if (detail >= 4) {
670
- caption += ", intricate";
671
- }
672
- }
673
-
674
- return caption;
675
- }
676
- }
677
-
678
- function generateTags(isNSFW, detail, style) {
679
- let tags = [];
680
-
681
- if (isNSFW) {
682
- tags.push("nsfw", "adult", "mature");
683
-
684
- if (style === 'erotic') {
685
- tags.push("erotic", "sensual", "seductive");
686
- } else if (style === 'bdsm') {
687
- tags.push("bdsm", "restraints", "dominance");
688
- } else if (style === 'fetish') {
689
- tags.push("fetish", "specialized", "kink");
690
- }
691
-
692
- tags.push("woman", "female", "adult female");
693
-
694
- if (detail >= 3) {
695
- tags.push("detailed", "anatomy", "curves");
696
- if (detail >= 4) {
697
- tags.push("skin texture", "breasts", "nipples");
698
- if (detail >= 5) {
699
- tags.push("areola", "toned", "fit");
700
- }
701
- }
702
- }
703
-
704
- tags.push("high quality", "professional");
705
- } else {
706
- tags.push("sfw", "safe", "general");
707
-
708
- if (style === 'artistic') {
709
- tags.push("artistic", "creative", "stylized");
710
- } else if (style === 'technical') {
711
- tags.push("technical", "precise", "accurate");
712
- } else if (style === 'literary') {
713
- tags.push("narrative", "storytelling", "dramatic");
714
- }
715
-
716
- tags.push("person", "human", "individual");
717
-
718
- if (detail >= 3) {
719
- tags.push("detailed", "textured", "complex");
720
- if (detail >= 4) {
721
- tags.push("intricate", "elaborate", "refined");
722
- }
723
- }
724
-
725
- tags.push("well-composed", "balanced");
726
- }
727
-
728
- // Add any custom tags
729
- const customTags = Array.from(tagsContainer.querySelectorAll('.tag-bubble span')).map(el => el.textContent);
730
- tags = tags.concat(customTags);
731
-
732
- return tags.join(", ");
733
- }
734
-
735
- function generatePrompt(isNSFW, detail, style) {
736
- let prompt = "";
737
-
738
- if (isNSFW) {
739
- prompt += "A high-quality NSFW image of a beautiful woman, ";
740
-
741
- if (style === 'erotic') {
742
- prompt += "erotic pose, sensual expression, ";
743
- } else if (style === 'bdsm') {
744
- prompt += "bound in leather restraints, submissive pose, ";
745
- } else if (style === 'fetish') {
746
- prompt += "wearing specialized fetish attire, kinky aesthetic, ";
747
- } else {
748
- prompt += "alluring composition, ";
749
- }
750
-
751
- if (detail >= 3) {
752
- prompt += "detailed anatomy, perfect proportions, ";
753
- if (detail >= 4) {
754
- prompt += "visible skin texture, realistic details, ";
755
- if (detail >= 5) {
756
- prompt += "intricate lighting on curves, ";
757
- }
758
- }
759
- }
760
-
761
- prompt += "professional photography, 8k resolution, ultra-detailed";
762
- } else {
763
- prompt += "A high-quality image of a person, ";
764
-
765
- if (style === 'artistic') {
766
- prompt += "artistic composition, creative framing, ";
767
- } else if (style === 'technical') {
768
- prompt += "technically precise, accurate proportions, ";
769
- } else if (style === 'literary') {
770
- prompt += "narrative quality, storytelling elements, ";
771
- } else {
772
- prompt += "well-composed, balanced aesthetic, ";
773
- }
774
-
775
- if (detail >= 3) {
776
- prompt += "detailed textures, complex elements, ";
777
- if (detail >= 4) {
778
- prompt += "intricate lighting, refined details, ";
779
- }
780
- }
781
-
782
- prompt += "professional, 8k resolution, ultra-detailed";
783
- }
784
-
785
- return prompt;
786
- }
787
-
788
- function generateTrainingData(isNSFW, detail, style) {
789
- let data = "Training data for AI model:\n\n";
790
-
791
- data += "IMAGE DESCRIPTION:\n";
792
- data += generateDescription(isNSFW, detail, style) + "\n\n";
793
-
794
- data += "TAGS:\n";
795
- data += generateTags(isNSFW, detail, style) + "\n\n";
796
-
797
- data += "PROMPT EXAMPLE:\n";
798
- data += generatePrompt(isNSFW, detail, style) + "\n\n";
799
-
800
- if (isNSFW) {
801
- data += "NSFW NOTES:\n";
802
- data += "- Focus on anatomical accuracy\n";
803
- data += "- Maintain tasteful presentation\n";
804
- if (style === 'bdsm') {
805
- data += "- Include BDSM elements authentically\n";
806
- } else if (style === 'fetish') {
807
- data += "- Represent fetish content accurately\n";
808
- }
809
- data += "\n";
810
- }
811
-
812
- data += "TRAINING PARAMETERS:\n";
813
- data += `- Detail level: ${detail}\n`;
814
- data += `- Style: ${style}\n`;
815
- data += `- NSFW: ${isNSFW ? 'Yes' : 'No'}\n`;
816
-
817
- return data;
818
- }
819
-
820
- function copyOutput() {
821
- const text = outputArea.textContent;
822
- navigator.clipboard.writeText(text).then(() => {
823
- alert('Output copied to clipboard!');
824
- });
825
- }
826
-
827
- function downloadOutput() {
828
- const text = outputArea.textContent;
829
- const blob = new Blob([text], {type: 'text/plain'});
830
- const url = URL.createObjectURL(blob);
831
- const a = document.createElement('a');
832
- a.href = url;
833
- a.download = 'image-description.txt';
834
- document.body.appendChild(a);
835
- a.click();
836
- document.body.removeChild(a);
837
- URL.revokeObjectURL(url);
838
- }
839
-
840
- function clearOutput() {
841
- outputArea.innerHTML = '<p class="text-gray-500 italic">Your generated text will appear here...</p>';
842
- }
843
-
844
- function enhanceOutput() {
845
- // Simulate enhancement
846
- outputArea.innerHTML = '<p class="text-gray-500 italic">Enhancing output... <i class="fas fa-spinner fa-spin"></i></p>';
847
-
848
- setTimeout(() => {
849
- const currentText = outputArea.textContent;
850
- outputArea.innerHTML = `<pre class="whitespace-pre-wrap">${currentText}\n\n[Enhanced with additional details and refined language]</pre>`;
851
- }, 1500);
852
- }
853
-
854
- function shortenOutput() {
855
- // Simulate shortening
856
- outputArea.innerHTML = '<p class="text-gray-500 italic">Shortening output... <i class="fas fa-spinner fa-spin"></i></p>';
857
-
858
- setTimeout(() => {
859
- const currentText = outputArea.textContent;
860
- const shortened = currentText.split(' ').slice(0, 30).join(' ') + '...';
861
- outputArea.innerHTML = `<pre class="whitespace-pre-wrap">${shortened}</pre>`;
862
- }, 1500);
863
- }
864
-
865
- function rewriteOutput() {
866
- // Simulate rewriting
867
- outputArea.innerHTML = '<p class="text-gray-500 italic">Rewriting output... <i class="fas fa-spinner fa-spin"></i></p>';
868
-
869
- setTimeout(() => {
870
- const currentText = outputArea.textContent;
871
- outputArea.innerHTML = `<pre class="whitespace-pre-wrap">[Rewritten version with different phrasing]\n${currentText.replace(/woman/g, 'female').replace(/beautiful/g, 'attractive')}</pre>`;
872
- }, 1500);
873
- }
874
-
875
- function switchTab(tabName) {
876
- tabContents.forEach(content => {
877
- content.classList.add('hidden');
878
- });
879
-
880
- tabBtns.forEach(btn => {
881
- btn.classList.remove('tab-active');
882
- });
883
-
884
- document.getElementById(`${tabName}Tab`).classList.remove('hidden');
885
- document.querySelector(`.tab-btn[data-tab="${tabName}"]`).classList.add('tab-active');
886
- }
887
- </script>
888
- <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=En3rGy/test" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
889
- </html>