Hugging Face's logo

Spaces:
sametay
/
anycoder-0eceea38
Running

App Files Community
sametay commited on
Commit
bc70162
·
verified ·
1 Parent(s): 723375e

Upload folder using huggingface_hub

Browse files
Files changed (1) hide show
  1. index.html +527 -19
index.html CHANGED
@@ -1,19 +1,527 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="tr">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>AI Hub - Yapay Zeka Siteleri Rehberi</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
9
+ <style>
10
+ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
11
+
12
+ * {
13
+ font-family: 'Inter', sans-serif;
14
+ }
15
+
16
+ .gradient-text {
17
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
18
+ -webkit-background-clip: text;
19
+ -webkit-text-fill-color: transparent;
20
+ background-clip: text;
21
+ }
22
+
23
+ .card-hover {
24
+ transition: all 0.3s ease;
25
+ }
26
+
27
+ .card-hover:hover {
28
+ transform: translateY(-5px);
29
+ box-shadow: 0 20px 40px rgba(0,0,0,0.1);
30
+ }
31
+
32
+ .tab-active {
33
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
34
+ color: white;
35
+ }
36
+
37
+ .tab-inactive {
38
+ background: #f3f4f6;
39
+ color: #6b7280;
40
+ }
41
+
42
+ .tab-inactive:hover {
43
+ background: #e5e7eb;
44
+ }
45
+
46
+ .search-input {
47
+ background: rgba(255,255,255,0.9);
48
+ backdrop-filter: blur(10px);
49
+ }
50
+
51
+ .category-badge {
52
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
53
+ }
54
+
55
+ @keyframes fadeIn {
56
+ from { opacity: 0; transform: translateY(20px); }
57
+ to { opacity: 1; transform: translateY(0); }
58
+ }
59
+
60
+ .fade-in {
61
+ animation: fadeIn 0.5s ease forwards;
62
+ }
63
+
64
+ .glass-effect {
65
+ background: rgba(255,255,255,0.8);
66
+ backdrop-filter: blur(10px);
67
+ border: 1px solid rgba(255,255,255,0.2);
68
+ }
69
+
70
+ .dark-glass {
71
+ background: rgba(17,24,39,0.8);
72
+ backdrop-filter: blur(10px);
73
+ }
74
+ </style>
75
+ </head>
76
+ <body class="bg-gray-50 min-h-screen">
77
+ <!-- Header -->
78
+ <header class="sticky top-0 z-50 glass-effect shadow-lg">
79
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
80
+ <div class="flex items-center justify-between">
81
+ <div class="flex items-center space-x-3">
82
+ <div class="w-10 h-10 rounded-xl bg-gradient-to-br from-indigo-500 to-purple-600 flex items-center justify-center">
83
+ <i class="fas fa-robot text-white text-xl"></i>
84
+ </div>
85
+ <div>
86
+ <h1 class="text-2xl font-bold gradient-text">AI Hub</h1>
87
+ <p class="text-xs text-gray-500">Yapay Zeka Siteleri Rehberi</p>
88
+ </div>
89
+ </div>
90
+
91
+ <!-- Search -->
92
+ <div class="hidden md:flex flex-1 max-w-xl mx-8">
93
+ <div class="relative w-full">
94
+ <input type="text" id="searchInput" placeholder="AI sitesi ara..."
95
+ class="w-full pl-12 pr-4 py-3 rounded-xl border-2 border-gray-200 focus:border-indigo-500 focus:outline-none transition-colors search-input">
96
+ <i class="fas fa-search absolute left-4 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
97
+ </div>
98
+ </div>
99
+
100
+ <a href="https://huggingface.co/spaces/akhaliq/anycoder" target="_blank"
101
+ class="hidden md:flex items-center space-x-2 px-4 py-2 rounded-lg bg-gradient-to-r from-indigo-500 to-purple-600 text-white text-sm font-medium hover:shadow-lg transition-shadow">
102
+ <i class="fas fa-code"></i>
103
+ <span>Built with anycoder</span>
104
+ </a>
105
+ </div>
106
+
107
+ <!-- Mobile Search -->
108
+ <div class="md:hidden mt-4">
109
+ <div class="relative">
110
+ <input type="text" id="searchInputMobile" placeholder="AI sitesi ara..."
111
+ class="w-full pl-12 pr-4 py-3 rounded-xl border-2 border-gray-200 focus:border-indigo-500 focus:outline-none transition-colors search-input">
112
+ <i class="fas fa-search absolute left-4 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
113
+ </div>
114
+ </div>
115
+ </div>
116
+ </header>
117
+
118
+ <!-- Main Content -->
119
+ <main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
120
+ <!-- Stats -->
121
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-8">
122
+ <div class="bg-white rounded-xl p-4 shadow-sm border border-gray-100">
123
+ <div class="text-2xl font-bold text-indigo-600" id="totalSites">0</div>
124
+ <div class="text-sm text-gray-500">Toplam Site</div>
125
+ </div>
126
+ <div class="bg-white rounded-xl p-4 shadow-sm border border-gray-100">
127
+ <div class="text-2xl font-bold text-purple-600" id="totalCategories">0</div>
128
+ <div class="text-sm text-gray-500">Kategori</div>
129
+ </div>
130
+ <div class="bg-white rounded-xl p-4 shadow-sm border border-gray-100">
131
+ <div class="text-2xl font-bold text-pink-600">150+</div>
132
+ <div class="text-sm text-gray-500">AI Aracı</div>
133
+ </div>
134
+ <div class="bg-white rounded-xl p-4 shadow-sm border border-gray-100">
135
+ <div class="text-2xl font-bold text-blue-600">Günlük</div>
136
+ <div class="text-sm text-gray-500">Güncellenir</div>
137
+ </div>
138
+ </div>
139
+
140
+ <!-- Category Tabs -->
141
+ <div class="mb-8">
142
+ <div class="flex flex-wrap gap-2" id="categoryTabs">
143
+ <!-- Tabs will be generated by JS -->
144
+ </div>
145
+ </div>
146
+
147
+ <!-- Sites Grid -->
148
+ <div id="sitesGrid" class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6">
149
+ <!-- Sites will be generated by JS -->
150
+ </div>
151
+
152
+ <!-- Empty State -->
153
+ <div id="emptyState" class="hidden text-center py-16">
154
+ <div class="w-24 h-24 mx-auto mb-4 rounded-full bg-gray-100 flex items-center justify-center">
155
+ <i class="fas fa-search text-4xl text-gray-400"></i>
156
+ </div>
157
+ <h3 class="text-xl font-semibold text-gray-700 mb-2">Sonuç bulunamadı</h3>
158
+ <p class="text-gray-500">Aramanızla eşleşen bir site bulunamadı.</p>
159
+ </div>
160
+ </main>
161
+
162
+ <!-- Footer -->
163
+ <footer class="bg-gray-900 text-white py-8 mt-16">
164
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
165
+ <div class="flex flex-col md:flex-row items-center justify-between">
166
+ <div class="flex items-center space-x-3 mb-4 md:mb-0">
167
+ <div class="w-8 h-8 rounded-lg bg-gradient-to-br from-indigo-500 to-purple-600 flex items-center justify-center">
168
+ <i class="fas fa-robot text-white text-sm"></i>
169
+ </div>
170
+ <span class="font-semibold">AI Hub</span>
171
+ </div>
172
+ <div class="flex items-center space-x-6 text-sm text-gray-400">
173
+ <a href="#" class="hover:text-white transition-colors">Hakkında</a>
174
+ <a href="#" class="hover:text-white transition-colors">İletişim</a>
175
+ <a href="#" class="hover:text-white transition-colors">Gizlilik</a>
176
+ </div>
177
+ <div class="mt-4 md:mt-0">
178
+ <a href="https://huggingface.co/spaces/akhaliq/anycoder" target="_blank"
179
+ class="text-sm text-gray-400 hover:text-white transition-colors">
180
+ Built with anycoder
181
+ </a>
182
+ </div>
183
+ </div>
184
+ </div>
185
+ </footer>
186
+
187
+ <script>
188
+ // AI Sites Database
189
+ const aiSites = {
190
+ "chatbots": {
191
+ name: "Sohbet Botları",
192
+ icon: "fa-comments",
193
+ color: "from-blue-500 to-cyan-500",
194
+ sites: [
195
+ { name: "ChatGPT", url: "https://chat.openai.com", desc: "OpenAI'nin güçlü sohbet botu", featured: true, tags: ["Metin", "Kod", "Analiz"] },
196
+ { name: "Claude", url: "https://claude.ai", desc: "Anthropic'ın güvenli AI asistanı", featured: true, tags: ["Metin", "Doküman", "Analiz"] },
197
+ { name: "Gemini", url: "https://gemini.google.com", desc: "Google'ın yapay zeka asistanı", featured: true, tags: ["Metin", "Görsel", "Arama"] },
198
+ { name: "Perplexity", url: "https://perplexity.ai", desc: "AI destekli arama motoru", featured: true, tags: ["Arama", "Kaynak", "Araştırma"] },
199
+ { name: "Copilot", url: "https://copilot.microsoft.com", desc: "Microsoft'un AI asistanı", featured: false, tags: ["Metin", "Görsel", "Ofis"] },
200
+ { name: "Poe", url: "https://poe.com", desc: "Birçok AI modeli tek yerde", featured: false, tags: ["Çoklu", "Bot", "Sohbet"] },
201
+ { name: "Character.AI", url: "https://character.ai", desc: "AI karakterlerle sohbet", featured: false, tags: ["Eğlence", "Karakter", "Sohbet"] },
202
+ { name: "YouChat", url: "https://you.com", desc: "AI arama ve sohbet", featured: false, tags: ["Arama", "Sohbet", "Özet"] },
203
+ { name: "Pi", url: "https://pi.ai", desc: "Kişisel AI asistanı", featured: false, tags: ["Kişisel", "Sohbet", "Destek"] },
204
+ { name: "HuggingChat", url: "https://huggingface.co/chat", desc: "Açık kaynak sohbet botu", featured: false, tags: ["Açık Kaynak", "Metin", "Kod"] }
205
+ ]
206
+ },
207
+ "image": {
208
+ name: "Görsel Oluşturma",
209
+ icon: "fa-image",
210
+ color: "from-purple-500 to-pink-500",
211
+ sites: [
212
+ { name: "Midjourney", url: "https://www.midjourney.com", desc: "En iyi AI görsel oluşturucu", featured: true, tags: ["Sanat", "Tasarım", "Profesyonel"] },
213
+ { name: "DALL-E 3", url: "https://openai.com/dall-e-3", desc: "OpenAI'ın görsel oluşturucusu", featured: true, tags: ["Metin-Görsel", "Gerçekçi", "Yaratıcı"] },
214
+ { name: "Stable Diffusion", url: "https://stability.ai", desc: "Açık kaynak görsel AI", featured: true, tags: ["Açık Kaynak", "Lokal", "Özelleştirilebilir"] },
215
+ { name: "Adobe Firefly", url: "https://www.adobe.com/sensei/generative-ai/firefly.html", desc: "Adobe'nin yaratıcı AI'sı", featured: true, tags: ["Tasarım", "Profesyonel", "Ticari"] },
216
+ { name: "Leonardo.ai", url: "https://leonardo.ai", desc: "Oyun ve sanat için AI görsel", featured: false, tags: ["Oyun", "Sanat", "3D"] },
217
+ { name: "Ideogram", url: "https://ideogram.ai", desc: "Metin içeren görseller", featured: false, tags: ["Tipografi", "Logo", "Metin"] },
218
+ { name: "Playground", url: "https://playgroundai.com", desc: "Ücretsiz AI görsel oluşturma", featured: false, tags: ["Ücretsiz", "Hızlı", "Kolay"] },
219
+ { name: "NightCafe", url: "https://nightcafe.studio", desc: "AI sanat topluluğu", featured: false, tags: ["Topluluk", "Sanat", "Yarışma"] },
220
+ { name: "Artbreeder", desc: "Karma ve evrimleşen görseller", featured: false, tags: ["Portre", "Karakter", "Karma"] },
221
+ { name: "Craiyon", url: "https://www.craiyon.com", desc: "Ücretsiz DALL-E mini", featured: false, tags: ["Ücretsiz", "Basit", "Hızlı"] },
222
+ { name: "DeepAI", url: "https://deepai.org", desc: "Çeşitli AI görsel araçları", featured: false, tags: ["Çeşitli", "API", "Araçlar"] },
223
+ { name: "Runway ML", url: "https://runwayml.com", desc: "Yaratıcı AI araçları", featured: true, tags: ["Video", "Görsel", "Profesyonel"] }
224
+ ]
225
+ },
226
+ "video": {
227
+ name: "Video Oluşturma",
228
+ icon: "fa-video",
229
+ color: "from-red-500 to-orange-500",
230
+ sites: [
231
+ { name: "Sora", url: "https://openai.com/sora", desc: "OpenAI'ın video oluşturucusu", featured: true, tags: ["Metin-Video", "Gerçekçi", "Uzun"] },
232
+ { name: "Runway Gen-2", url: "https://runwayml.com/gen-2", desc: "Metin/görselden video", featured: true, tags: ["Metin-Video", "Görsel-Video", "Profesyonel"] },
233
+ { name: "Pika Labs", url: "https://pika.art", desc: "AI video oluşturma", featured: true, tags: ["Hızlı", "Yaratıcı", "Kolay"] },
234
+ { name: "HeyGen", url: "https://www.heygen.com", desc: "AI avatar ve video", featured: true, tags: ["Avatar", "TTS", "Pazarlama"] },
235
+ { name: "Synthesia", url: "https://www.synthesia.io", desc: "AI video sunumları", featured: false, tags: ["Eğitim", "Kurumsal", "Avatar"] },
236
+ { name: "InVideo", url: "https://invideo.io", desc: "Metinden video oluşturma", featured: false, tags: ["Metin-Video", "Şablon", "Hızlı"] },
237
+ { name: "Fliki", url: "https://fliki.ai", desc: "Blogdan video yapma", featured: false, tags: ["Blog-Video", "TTS", "Sosyal"] },
238
+ { name: "Descript", url: "https://www.descript.com", desc: "Video düzenleme ve AI", featured: false, tags: ["Düzenleme", "Transkript", "Podcast"] },
239
+ { name: "Lumen5", url: "https://lumen5.com", desc: "Metinden video oluşturma", featured: false, tags: ["Pazarlama", "Sosyal", "Hızlı"] },
240
+ { name: "Pictory", url: "https://pictory.ai", desc: "Uzun videodan kısa içerik", featured: false, tags: ["Özet", "Klip", "Sosyal"] }
241
+ ]
242
+ },
243
+ "code": {
244
+ name: "Kod & Geliştirme",
245
+ icon: "fa-code",
246
+ color: "from-green-500 to-emerald-500",
247
+ sites: [
248
+ { name: "GitHub Copilot", url: "https://github.com/features/copilot", desc: "AI kod tamamlayıcı", featured: true, tags: ["Kod", "IDE", "Üretkenlik"] },
249
+ { name: "Cursor", url: "https://cursor.sh", desc: "AI-first kod editörü", featured: true, tags: ["Editör", "Chat", "Kod"] },
250
+ { name: "Codeium", url: "https://codeium.com", desc: "Ücretsiz GitHub Copilot alternatifi", featured: true, tags: ["Ücretsiz", "Hızlı", "IDE"] },
251
+ { name: "Tabnine", url: "https://www.tabnine.com", desc: "AI kod tamamlayıcı", featured: false, tags: ["Gizlilik", "Lokal", "Kurumsal"] },
252
+ { name: "Replit Ghostwriter", url: "https://replit.com", desc: "Replit'in AI asistanı", featured: false, tags: ["Bulut", "Eğitim", "Hızlı"] },
253
+ { name: "Amazon CodeWhisperer", url: "https://aws.amazon.com/codewhisperer", desc: "AWS'nin kod AI'sı", featured: false, tags: ["AWS", "Güvenlik", "Ücretsiz"] },
254
+ { name: "Sourcegraph Cody", url: "https://sourcegraph.com/cody", desc: "Kod anlayışı ve AI", featured: false, tags: ["Kod Arama", "Analiz", "Büyük Kod"] },
255
+ { name: "JetBrains AI", url: "https://www.jetbrains.com/ai", desc: "IDE'ler için AI", featured: false, tags: ["IDE", "Entegre", "Profesyonel"] },
256
+ { name: "CodeT5", url: "https://huggingface.co/Salesforce/codet5-base", desc: "Açık kaynak kod modeli", featured: false, tags: ["Açık Kaynak", "Araştırma", "Hugging Face"] },
257
+ { name: "AlphaCode", url: "https://alphacode.deepmind.com", desc: "DeepMind'ın kod AI'sı", featured: false, tags: ["Yarışma", "Araştırma", "Derin"] }
258
+ ]
259
+ },
260
+ "audio": {
261
+ name: "Ses & Müzik",
262
+ icon: "fa-music",
263
+ color: "from-yellow-500 to-amber-500",
264
+ sites: [
265
+ { name: "Suno AI", url: "https://www.suno.ai", desc: "Metinden şarkı oluşturma", featured: true, tags: ["Müzik", "Şarkı", "Yaratıcı"] },
266
+ { name: "Udio", url: "https://www.udio.com", desc: "AI müzik oluşturucu", featured: true, tags: ["Müzik", "Yüksek Kalite", "Yaratıcı"] },
267
+ { name: "ElevenLabs", url: "https://elevenlabs.io", desc: "En gerçekçi AI ses", featured: true, tags: ["TTS", "Ses Klonlama", "Profesyonel"] },
268
+ { name: "Murf AI", url: "https://murf.ai", desc: "AI seslendirme stüdyosu", featured: true, tags: ["TTS", "Video", "Kurumsal"] },
269
+ { name: "AIVA", url: "https://www.aiva.ai", desc: "AI müzik bestecisi", featured: false, tags: ["Klasik",Film", "Lisans"] },
270
+ { name: "Soundraw", url: "https://soundraw.io", desc: "Telifsiz AI müzik", featured: false, tags: ["Telifsiz", "Özelleştirilebilir", "İçerik"] },
271
+ { name: "Boomy", url: "https://boomy.com", desc: "Hızlı AI şarkı yapma", featured: false, tags: ["Hızlı", "Kolay", "Dağıtım"] },
272
+ { name: "Voice.ai", url: "https://voice.ai", desc: "Gerçek zamanlı ses değiştirme", featured: false, tags: ["Ses Değiştirme", "Canlı", "Oyun"] },
273
+ { name: "Whisper", url: "https://openai.com/whisper", desc: "OpenAI'ın konuşma tanıma", featured: false, tags: ["Transkript", "Çeviri", "Açık Kaynak"] },
274
+ { name: "Descript Overdub", url: "https://www.descript.com/overdub", desc: "Ses klonlama ve düzenleme", featured: false, tags: ["Ses Klonlama", "Düzenleme", "Podcast"] }
275
+ ]
276
+ },
277
+ "writing": {
278
+ name: "Yazı & İçerik",
279
+ icon: "fa-pen-fancy",
280
+ color: "from-pink-500 to-rose-500",
281
+ sites: [
282
+ { name: "Jasper", url: "https://www.jasper.ai", desc: "AI pazarlama yazıları", featured: true, tags: ["Pazarlama", "SEO", "Kurumsal"] },
283
+ { name: "Copy.ai", url: "https://www.copy.ai", desc: "AI kopya yazma", featured: true, tags: ["Kopya", "Sosyal", "Hızlı"] },
284
+ { name: "Notion AI", url: "https://www.notion.so/product/ai", desc: "Notion'un AI asistanı", featured: true, tags: ["Notlar", "Özet", "Yazı"] },
285
+ { name: "Grammarly", url: "https://www.grammarly.com", desc: "AI yazım asistanı", featured: true, tags: ["Dil Bilgisi", "İmla", "Profesyonel"] },
286
+ { name: "Writesonic", url: "https://writesonic.com", desc: "AI içerik oluşturucu", featured: false, tags: ["Blog", "SEO", "Reklam"] },
287
+ { name: "Rytr", url: "https://rytr.me", desc: "Uygun fiyatlı AI yazar", featured: false, tags: ["Ekonomik", "Çoklu Dil", "Hızlı"] },
288
+ { name: "Wordtune", url: "https://www.wordtune.com", desc: "Cümle yeniden yazma", featured: false, tags: ["Parafraz", "Netlik", "İyileştirme"] },
289
+ { name: "Sudowrite", url: "https://www.sudowrite.com", desc: "Yaratıcı yazım AI'sı", featured: false, tags: ["Hikaye", "Roman", "Yaratıcı"] },
290
+ { name: "QuillBot", url: "https://quillbot.com", desc: "Parafraz ve özetleme", featured: false, tags: ["Parafraz", "Özet", "Akademik"] },
291
+ { name: "Lex", url: "https://lex.page", desc: "AI destekli yazım", featured: false, tags: ["Minimal", "Odak", "Yazarlar"] }
292
+ ]
293
+ },
294
+ "design": {
295
+ name: "Tasarım & UI",
296
+ icon: "fa-palette",
297
+ color: "from-indigo-500 to-violet-500",
298
+ sites: [
299
+ { name: "Canva AI", url: "https://www.canva.com/magic", desc: "Canva'nın AI araçları", featured: true, tags: ["Tasarım", "Sosyal", "Kolay"] },
300
+ { name: "Figma AI", url: "https://www.figma.com/ai", desc: "Figma'nın AI özellikleri", featured: true, tags: ["UI/UX", "Tasarım", "İşbirliği"] },
301
+ { name: "Uizard", url: "https://uizard.io", desc: "AI UI tasarım aracı", featured: true, tags: ["UI", "Tel Çerçeve", "Otomatik"] },
302
+ { name: "Galileo AI", url: "https://www.usegalileo.ai", desc: "Metinden UI tasarımı", featured: true, tags: ["Metin-UI", "Hızlı", "Profesyonel"] },
303
+ { name: "Framer AI", url: "https://www.framer.com/ai", desc: "AI web sitesi oluşturucu", featured: false, tags: ["Web", "Site", "Canlı"] },
304
+ { name: "Visily", url: "https://www.visily.ai", desc: "AI tel çerçeve ve prototip", featured: false, tags: ["Tel Çerçeve", "Ekran Görüntüsü", "Hızlı"] },
305
+ { name: "Khroma", url: "http://khroma.co", desc: "AI renk paleti üretici", featured: false, tags: ["Renk", "Palet", "Tasarım"] },
306
+ { name: "Let's Enhance", url: "https://letsenhance.io", desc: "AI görsel yükseltme", featured: false, tags: ["Yükseltme", "Kalite", "Baskı"] },
307
+ { name: "Remove.bg", url: "https://www.remove.bg", desc: "Arka plan kaldırma", featured: false, tags: ["Arka Plan", "Hızlı", "Otomatik"] },
308
+ { name: "Looka", url: "https://looka.com", desc: "AI logo oluşturucu", featured: false, tags: ["Logo", "Marka", "Kimlik"] }
309
+ ]
310
+ },
311
+ "productivity": {
312
+ name: "Verimlilik & Araçlar",
313
+ icon: "fa-bolt",
314
+ color: "from-teal-500 to-cyan-500",
315
+ sites: [
316
+ { name: "Mem.ai", url: "https://mem.ai", desc: "AI not alma uygulaması", featured: true, tags: ["Notlar", "Bellek", "Organizasyon"] },
317
+ { name: "Otter.ai", url: "https://otter.ai", desc: "AI toplantı asistanı", featured: true, tags: ["Transkript", "Toplantı", "İş"] },
318
+ { name: "Fireflies.ai", url: "https://fireflies.ai", desc: "Toplantı kayıt ve analiz", featured: true, tags: ["Toplantı", "CRM", "Analiz"] },
319
+ { name: "Rewind", url: "https://www.rewind.ai", desc: "Kişisel AI belleği", featured: true, tags: ["Bellek", "Arama", "Gizlilik"] },
320
+ { name: "Raycast AI", url: "https://www.raycast.com", desc: "Mac için AI asistanı", featured: false, tags: ["Mac", "Kısayol", "Üretkenlik"] },
321
+ { name: "Taskade", url: "https://www.taskade.com", desc: "AI proje yönetimi", featured: false, tags: ["Proje", "Takım", "Otomasyon"] },
322
+ { name: "Motion", url: "https://www.usemotion.com", desc: "AI takvim ve planlayıcı", featured: false, tags: ["Takvim", "Planlama", "Zaman"] },
323
+ { name: "Reclaim.ai", url: "https://reclaim.ai", desc: "Akıllı takvim planlama", featured: false, tags: ["Takvim", "Zaman", "Denge"] },
324
+ { name: "Tome", url: "https://tome.app", desc: "AI sunum oluşturucu", featured: false, tags: ["Sunum", "Hikaye", "Görsel"] },
325
+ { name: "Gamma", url: "https://gamma.app", desc: "AI belge ve sunum", featured: false, tags: ["Belge", "Sunum", "Web"] }
326
+ ]
327
+ },
328
+ "research": {
329
+ name: "Araştırma & Eğitim",
330
+ icon: "fa-graduation-cap",
331
+ color: "from-orange-500 to-red-500",
332
+ sites: [
333
+ { name: "Elicit", url: "https://elicit.org", desc: "AI araştırma asistanı", featured: true, tags: ["Araştırma", "Makale", "Analiz"] },
334
+ { name: "Consensus", url: "https://consensus.app", desc: "Bilimsel arama motoru", featured: true, tags: ["Bilim", "Kanıt", "Arama"] },
335
+ { name: "Semantic Scholar", url: "https://www.semanticscholar.org", desc: "AI destekli akademik arama", featured: true, tags: ["Akademik", "Makale", "Özet"] },
336
+ { name: "Research Rabbit", url: "https://www.researchrabbit.ai", desc: "Araştırma haritası oluşturucu", featured: true, tags: ["Keşif", "Harita", "İlişki"] },
337
+ { name: "Connected Papers", url: "https://www.connectedpapers.com", desc: "Makale ilişki grafiği", featured: false, tags: ["Graf", "İlişki", "Keşif"] },
338
+ { name: "Scite", url: "https://scite.ai", desc: "Akıllı alıntı analizi", featured: false, tags: ["Alıntı", "Doğrulama", "Kontekst"] },
339
+ { name: "Scholarcy", url: "https://www.scholarcy.com", desc: "Araştırma özetleyici", featured: false, tags: ["Özet", "Flashcard", "Hızlı"] },
340
+ { name: "Jenni AI", url: "https://jenni.ai", desc: "Akademik yazım asistanı", featured: false, tags: ["Akademik", "Yazı", "Atıf"] },
341
+ { name: "Explainpaper", url: "https://www.explainpaper.com", desc: "Karmaşık makaleleri açıkla", featured: false, tags: ["Açıklama", "Basitleştirme", "Öğrenme"] },
342
+ { name: "SciSpace", url: "https://typeset.io", desc: "Araştırma okuma ve yazma", featured: false, tags: ["Okuma", "Yazı", "İşbirliği"] }
343
+ ]
344
+ },
345
+ "multimodal": {
346
+ name: "Çok Modlu AI",
347
+ icon: "fa-layer-group",
348
+ color: "from-emerald-500 to-green-500",
349
+ sites: [
350
+ { name: "GPT-4V", url: "https://openai.com/gpt-4", desc: "Görsel anlayışlı GPT-4", featured: true, tags: ["Görsel", "Metin", "Analiz"] },
351
+ { name: "Gemini Pro", url: "https://deepmind.google/technologies/gemini", desc: "Google'ın çok modlu AI'sı", featured: true, tags: ["Çok Modlu", "Görsel", "Video"] },
352
+ { name: "Claude 3", url: "https://www.anthropic.com/claude", desc: "Çok modlu Claude", featured: true, tags: ["Görsel", "Doküman", "Analiz"] },
353
+ { name: "LLaVA", url: "https://llava-vl.github.io", desc: "Açık kaynak çok modlu", featured: false, tags: ["Açık Kaynak", "Görsel", "Sohbet"] },
354
+ { name: "Bard / Gemini", url: "https://gemini.google.com", desc: "Google'ın evrimleşen AI'sı", featured: false, tags: ["Arama", "Görsel", "Entegre"] },
355
+ { name: "Meta AI", url: "https://www.meta.ai", desc: "Meta'nın çok modlu AI'sı", featured: false, tags: ["Sosyal", "Görsel", "Ücretsiz"] },
356
+ { name: "Qwen-VL", url: "https://huggingface.co/Qwen", desc: "Alibaba'nın görsel LLM'i", featured: false, tags: ["Görsel", "Çoklu Dil", "Açık"] },
357
+ { name: "Fuyu-8B", url: "https://www.adept.ai/blog/fuyu-8b", desc: "Adept'in çok modlu modeli", featured: false, tags: ["Doküman", "Arayüz", "Eylem"] },
358
+ { name: "IDEFICS", url: "https://huggingface.co/blog/idefics", desc: "Açık çok modlu model", featured: false, tags: ["Açık Kaynak", "Görsel", "Sohbet"] },
359
+ { name: "KOSMOS-2", url: "https://huggingface.co/microsoft/kosmos-2-patch14-224", desc: "Microsoft'un çok modlu", featured: false, tags: ["Görsel",Yerleştirme", "Açık"] }
360
+ ]
361
+ }
362
+ };
363
+
364
+ let currentCategory = 'all';
365
+ let searchTerm = '';
366
+
367
+ // Initialize
368
+ document.addEventListener('DOMContentLoaded', () => {
369
+ renderStats();
370
+ renderTabs();
371
+ renderSites();
372
+ setupSearch();
373
+ });
374
+
375
+ function renderStats() {
376
+ let totalSites = 0;
377
+ let totalCategories = Object.keys(aiSites).length;
378
+
379
+ Object.values(aiSites).forEach(cat => {
380
+ totalSites += cat.sites.length;
381
+ });
382
+
383
+ document.getElementById('totalSites').textContent = totalSites;
384
+ document.getElementById('totalCategories').textContent = totalCategories;
385
+ }
386
+
387
+ function renderTabs() {
388
+ const tabsContainer = document.getElementById('categoryTabs');
389
+ const categories = Object.entries(aiSites);
390
+
391
+ // All tab
392
+ const allBtn = createTab('all', 'Tümü', 'fa-th-large', true);
393
+ tabsContainer.appendChild(allBtn);
394
+
395
+ // Category tabs
396
+ categories.forEach(([key, category]) => {
397
+ const btn = createTab(key, category.name, category.icon, false);
398
+ tabsContainer.appendChild(btn);
399
+ });
400
+ }
401
+
402
+ function createTab(key, name, icon, isActive) {
403
+ const btn = document.createElement('button');
404
+ btn.className = `px-4 py-2 rounded-lg font-medium text-sm transition-all flex items-center space-x-2 ${
405
+ isActive ? 'tab-active' : 'tab-inactive'
406
+ }`;
407
+ btn.innerHTML = `<i class="fas ${icon}"></i><span>${name}</span>`;
408
+ btn.onclick = () => switchCategory(key, btn);
409
+ btn.dataset.category = key;
410
+ return btn;
411
+ }
412
+
413
+ function switchCategory(category, clickedBtn) {
414
+ currentCategory = category;
415
+
416
+ // Update active state
417
+ document.querySelectorAll('#categoryTabs button').forEach(btn => {
418
+ btn.className = 'px-4 py-2 rounded-lg font-medium text-sm transition-all flex items-center space-x-2 tab-inactive';
419
+ });
420
+ clickedBtn.className = 'px-4 py-2 rounded-lg font-medium text-sm transition-all flex items-center space-x-2 tab-active';
421
+
422
+ renderSites();
423
+ }
424
+
425
+ function renderSites() {
426
+ const grid = document.getElementById('sitesGrid');
427
+ const emptyState = document.getElementById('emptyState');
428
+ grid.innerHTML = '';
429
+
430
+ let sitesToShow = [];
431
+
432
+ if (currentCategory === 'all') {
433
+ Object.entries(aiSites).forEach(([catKey, category]) => {
434
+ category.sites.forEach(site => {
435
+ sitesToShow.push({ ...site, category: category.name, categoryKey: catKey, color: category.color });
436
+ });
437
+ });
438
+ } else {
439
+ const category = aiSites[currentCategory];
440
+ sitesToShow = category.sites.map(site => ({
441
+ ...site,
442
+ category: category.name,
443
+ categoryKey: currentCategory,
444
+ color: category.color
445
+ }));
446
+ }
447
+
448
+ // Filter by search
449
+ if (searchTerm) {
450
+ sitesToShow = sitesToShow.filter(site =>
451
+ site.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
452
+ site.desc.toLowerCase().includes(searchTerm.toLowerCase()) ||
453
+ site.tags.some(tag => tag.toLowerCase().includes(searchTerm.toLowerCase()))
454
+ );
455
+ }
456
+
457
+ // Sort: featured first
458
+ sitesToShow.sort((a, b) => (b.featured === a.featured) ? 0 : b.featured ? 1 : -1);
459
+
460
+ if (sitesToShow.length === 0) {
461
+ emptyState.classList.remove('hidden');
462
+ return;
463
+ } else {
464
+ emptyState.classList.add('hidden');
465
+ }
466
+
467
+ sitesToShow.forEach((site, index) => {
468
+ const card = createSiteCard(site, index);
469
+ grid.appendChild(card);
470
+ });
471
+ }
472
+
473
+ function createSiteCard(site, index) {
474
+ const div = document.createElement('div');
475
+ div.className = 'bg-white rounded-2xl p-6 shadow-sm border border-gray-100 card-hover fade-in';
476
+ div.style.animationDelay = `${index * 0.05}s`;
477
+
478
+ const featuredBadge = site.featured ?
479
+ `<span class="absolute -top-2 -right-2 w-8 h-8 bg-gradient-to-r from-yellow-400 to-orange-500 rounded-full flex items-center justify-center shadow-lg">
480
+ <i class="fas fa-star text-white text-xs"></i>
481
+ </span>` : '';
482
+
483
+ div.innerHTML = `
484
+ <div class="relative">
485
+ ${featuredBadge}
486
+ <div class="flex items-start justify-between mb-4">
487
+ <div class="w-12 h-12 rounded-xl bg-gradient-to-br ${site.color} flex items-center justify-center text-white font-bold text-lg">
488
+ ${site.name.charAt(0)}
489
+ </div>
490
+ <span class="text-xs font-medium px-2 py-1 rounded-full bg-gray-100 text-gray-600">
491
+ ${site.category}
492
+ </span>
493
+ </div>
494
+
495
+ <h3 class="text-lg font-bold text-gray-900 mb-2">${site.name}</h3>
496
+ <p class="text-sm text-gray-600 mb-4 line-clamp-2">${site.desc}</p>
497
+
498
+ <div class="flex flex-wrap gap-1 mb-4">
499
+ ${site.tags.map(tag => `<span class="text-xs px-2 py-1 rounded-md bg-indigo-50 text-indigo-600">${tag}</span>`).join('')}
500
+ </div>
501
+
502
+ <a href="${site.url || '#'}" target="_blank" rel="noopener noreferrer"
503
+ class="w-full flex items-center justify-center space-x-2 py-2.5 rounded-xl bg-gray-900 text-white text-sm font-medium hover:bg-gray-800 transition-colors">
504
+ <span>Ziyaret Et</span>
505
+ <i class="fas fa-external-link-alt text-xs"></i>
506
+ </a>
507
+ </div>
508
+ `;
509
+
510
+ return div;
511
+ }
512
+
513
+ function setupSearch() {
514
+ const searchInput = document.getElementById('searchInput');
515
+ const searchInputMobile = document.getElementById('searchInputMobile');
516
+
517
+ const handleSearch = (e) => {
518
+ searchTerm = e.target.value;
519
+ renderSites();
520
+ };
521
+
522
+ searchInput.addEventListener('input', handleSearch);
523
+ searchInputMobile.addEventListener('input', handleSearch);
524
+ }
525
+ </script>
526
+ </body>
527
+ </html>