<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>프로젝트 뷰어 (자동 분류 및 URL 변환)</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f9;
color: #333;
}
.github-link {
text-align: center;
padding: 8px;
background-color: #24292e;
color: #fff;
font-size: 14px;
}
.github-link a {
color: #fff;
text-decoration: none;
}
.filter-group {
padding: 10px;
background-color: #fff;
border-bottom: 1px solid #eee;
text-align: center;
overflow-x: auto;
white-space: nowrap;
}
.filter-group .toggle-button {
padding: 6px 12px;
margin: 5px;
border: 1px solid #ddd;
border-radius: 15px;
background-color: #fff;
font-size: 13px;
cursor: pointer;
display: inline-block;
}
.filter-group .toggle-button.active {
background-color: #2196f3;
border-color: #2196f3;
color: #fff;
}
.main-container {
display: flex;
height: calc(100vh - 100px); /* 상단 영역 제외 전체 높이 */
}
#sidebar {
width: 25%;
border-right: 1px solid #ccc;
overflow-y: auto;
padding: 10px;
}
#sidebar ul {
list-style: none;
padding: 0;
margin: 0;
}
#sidebar li {
margin: 5px 0;
padding: 8px;
background-color: #fff;
border: 1px solid #ddd;
border-radius: 4px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: space-between;
}
#sidebar li:hover {
background-color: #f0f0f0;
}
#sidebar li button {
margin-left: 8px;
padding: 4px 8px;
cursor: pointer;
font-size: 12px;
border-radius: 4px;
border: 1px solid #ccc;
background-color: #fafafa;
}
#embed-container {
flex: 1;
padding: 0;
margin: 0;
background-color: #fff;
}
#embed-container iframe {
width: 100%;
height: 100%;
border: none;
display: block;
}
</style>
</head>
<body>
<div class="github-link">
<a href="https://discord.gg/openfreeai" target="_blank">Community</a>
</div>
<!-- 필터 버튼 영역 -->
<div class="filter-group" id="filter-group">
<!-- JavaScript로 동적으로 버튼 생성 -->
</div>
<div class="main-container">
<div id="sidebar"></div>
<div id="embed-container">
<iframe id="embed-frame" src=""></iframe>
</div>
</div>
<script>
// 1. 프로젝트 URL 목록: 프로젝트 이름 -> URL
const projectList = {
"ginipick/spaces-research-korea": "https://huggingface.co/spaces/ginipick/spaces-research-korea",
"openfree/Datasets-Convertor": "https://huggingface.co/spaces/openfree/Datasets-Convertor",
"VIDraft/mouse-Visual-Chat": "https://huggingface.co/spaces/VIDraft/mouse-Visual-Chat",
"VIDraft/mouse-file-chat": "https://huggingface.co/spaces/VIDraft/mouse-file-chat",
"openfree/Parquet-CSV-Convertor": "https://huggingface.co/spaces/openfree/Parquet-CSV-Convertor",
"ginigen/FLUX-Eternity": "https://huggingface.co/spaces/ginigen/FLUX-Eternity",
"ginipick/live-detect-pose": "https://huggingface.co/spaces/ginipick/live-detect-pose",
"ginigen/OmniParser-v2-pro": "https://huggingface.co/spaces/ginigen/OmniParser-v2-pro",
"ginigen/Celebrity": "https://huggingface.co/spaces/ginigen/Celebrity",
"ginigen/Fashion-Pose-Control": "https://huggingface.co/spaces/ginigen/Fashion-Pose-Control",
"ginigen/zonos-longform": "https://huggingface.co/spaces/ginigen/zonos-longform",
"ginigen/Ovis2-8B": "https://huggingface.co/spaces/ginigen/Ovis2-8B",
"ginigen/Workflow-Canvas": "https://huggingface.co/spaces/ginigen/Workflow-Canvas",
"ginigen/Design": "https://huggingface.co/spaces/ginigen/Design",
"ginigen/Diagram": "https://huggingface.co/spaces/ginigen/Diagram",
"ginigen/Mockup": "https://huggingface.co/spaces/ginigen/Mockup",
"ginigen/Infographic": "https://huggingface.co/spaces/ginigen/Infographic",
"ginigen/Flowchart": "https://huggingface.co/spaces/ginigen/Flowchart",
"aiqcamp/FLUX-Vision": "https://huggingface.co/spaces/aiqcamp/FLUX-Vision",
"ginigen/VoiceClone-TTS": "https://huggingface.co/spaces/ginigen/VoiceClone-TTS",
"fantos/Panorama": "https://huggingface.co/spaces/fantos/Panorama",
"ginigen/Multi-LoRAgen": "https://huggingface.co/spaces/ginigen/Multi-LoRAgen",
"ginigen/canvas-studio": "https://huggingface.co/spaces/ginigen/canvas-studio",
"ginipick/Fashion-Stylegen": "https://huggingface.co/spaces/ginipick/Fashion-Style",
"ginipick/Time-Stream": "https://huggingface.co/spaces/ginipick/Time-Stream",
"ginipick/AccuVision-Diffusion": "https://huggingface.co/spaces/ginipick/AccuVision-Diffusion",
"fantos/Magic-Drawings": "https://huggingface.co/spaces/fantos/Magic-Drawings",
"ginigen/Lumina-Image-PLUS": "https://huggingface.co/spaces/ginigen/Lumina-Image-PLUS",
"fantaxy/fantasy-novel": "https://huggingface.co/spaces/fantaxy/fantasy-novel",
"fantaxy/eros": "https://huggingface.co/spaces/fantaxy/eros",
"fantaxy/adult-novel": "https://huggingface.co/spaces/fantaxy/adult-novel",
"fantaxy/kungfu-novel": "https://huggingface.co/spaces/fantaxy/kungfu-novel",
"fantaxy/love-novel": "https://huggingface.co/spaces/fantaxy/love-novel",
"VIDraft/mouse-webgen": "https://huggingface.co/spaces/VIDraft/mouse-webgen",
"immunobiotech/MUSIC-Jukebox": "https://huggingface.co/spaces/immunobiotech/MUSIC-Jukebox",
"seawolf2357/Flowise-AI": "https://huggingface.co/spaces/seawolf2357/Flowise-AI",
"ginigen/Flux-LayerDiffuse": "https://huggingface.co/spaces/ginigen/Flux-LayerDiffuse",
"VIDraft/Portrait-Animation": "https://huggingface.co/spaces/VIDraft/Portrait-Animation",
"VIDraft/Deepseek-Multimodal": "https://huggingface.co/spaces/VIDraft/Deepseek-Multimodal",
"VIDraft/BLIP2": "https://huggingface.co/spaces/VIDraft/BLIP2",
"ginigen/text3d-r1": "https://huggingface.co/spaces/ginigen/text3d-r1",
"immunobiotech/drug-discovery": "https://huggingface.co/spaces/immunobiotech/drug-discovery",
"openfree/VisionOCR-Chat": "https://huggingface.co/spaces/openfree/VisionOCR-Chat",
"immunobiotech/MICHELIN": "https://huggingface.co/spaces/immunobiotech/MICHELIN",
"immunobiotech/MICHELIN-korea": "https://huggingface.co/spaces/immunobiotech/MICHELIN-korea",
"immunobiotech/MICHELIN-japan": "https://huggingface.co/spaces/immunobiotech/MICHELIN-japan",
"immunobiotech/MICHELIN-china": "https://huggingface.co/spaces/immunobiotech/MICHELIN-china",
"VIDraft/money-radar-korea": "https://huggingface.co/spaces/VIDraft/money-radar-korea",
"VIDraft/money-radar": "https://huggingface.co/spaces/VIDraft/money-radar",
"ginipick/PharmAI-Korea": "https://huggingface.co/spaces/ginipick/PharmAI-Korea",
"ginigen/MagicFace-V3": "https://huggingface.co/spaces/ginigen/MagicFace-V3",
"aiqcamp/MindMap": "https://huggingface.co/spaces/aiqcamp/MindMap",
"ginigen/3D-LLAMA": "https://huggingface.co/spaces/ginigen/3D-LLAMA",
"openfree/VectorFlow": "https://huggingface.co/spaces/openfree/VectorFlow",
"openfree/webtoon-gen": "https://huggingface.co/spaces/openfree/webtoon-gen",
"VIDraft/topic-prediction": "https://huggingface.co/spaces/VIDraft/topic-prediction",
"VIDraft/PapersImpact": "https://huggingface.co/spaces/VIDraft/PapersImpact",
"VIDraft/EveryRAG": "https://huggingface.co/spaces/VIDraft/EveryRAG",
"VIDraft/korea-president-DJ": "https://huggingface.co/spaces/VIDraft/korea-president-DJ",
"VIDraft/korea-president-PARK": "https://huggingface.co/spaces/VIDraft/korea-president-PARK",
"openfree/image-to-vector": "https://huggingface.co/spaces/openfree/image-to-vector",
"ginipick/QR-Canvas-plus": "https://huggingface.co/spaces/ginipick/QR-Canvas-plus",
"ginigen/text3d-R1": "https://huggingface.co/spaces/ginigen/text3d-R1",
"openfree/MagicFace-V3": "https://huggingface.co/spaces/openfree/MagicFace-V3",
"ginipick/DeepSeekR1-LIVE": "https://huggingface.co/spaces/ginipick/DeepSeekR1-LIVE",
"ginigen/ColPali-multi": "https://huggingface.co/spaces/ginigen/ColPali-multi",
"ginigen/Janus-Pro-7B": "https://huggingface.co/spaces/ginigen/Janus-Pro-7B",
"ginigen/Animagine": "https://huggingface.co/spaces/ginigen/Animagine",
"openfree/PDF-RAG": "https://huggingface.co/spaces/openfree/PDF-RAG",
"fantos/Ranking-Tracker": "https://huggingface.co/spaces/fantos/Ranking-Tracker",
"aiqcamp/Multilingual-Images": "https://huggingface.co/spaces/aiqcamp/Multilingual-Images",
"aiqcamp/Gemini2-Flash-Thinking": "https://huggingface.co/spaces/aiqcamp/Gemini2-Flash-Thinking",
"openfree/pepe": "https://huggingface.co/spaces/openfree/pepe",
"openfree/korea-president-yoon": "https://huggingface.co/spaces/openfree/korea-president-yoon",
"openfree/CryptoVision": "https://huggingface.co/spaces/openfree/CryptoVision",
"fantos/VoiceClone": "https://huggingface.co/spaces/fantos/VoiceClone",
"seawolf2357/ocrlatex": "https://huggingface.co/spaces/seawolf2357/ocrlatex",
"seawolf2357/img2vid": "https://huggingface.co/spaces/seawolf2357/img2vid",
"seawolf2357/sd-prompt-gen": "https://huggingface.co/spaces/seawolf2357/sd-prompt-gen",
"openfree/tarotcard": "https://huggingface.co/spaces/openfree/tarotcard",
"aiqcamp/Polaroid": "https://huggingface.co/spaces/aiqcamp/Polaroid",
"ginigen/cartoon": "https://huggingface.co/spaces/ginigen/cartoon",
"ginigen/Book-Cover": "https://huggingface.co/spaces/ginigen/Book-Cover",
"aiqcamp/fash": "https://huggingface.co/spaces/aiqcamp/fash",
"gunship999/Korea-Daily-News": "https://huggingface.co/spaces/gunship999/Korea-Daily-News",
"immunobiotech/ChicagoGallery": "https://huggingface.co/spaces/immunobiotech/ChicagoGallery",
"immunobiotech/MetropolitanMuseum": "https://huggingface.co/spaces/immunobiotech/MetropolitanMuseum",
"immunobiotech/opensky": "https://huggingface.co/spaces/immunobiotech/opensky",
"aiqtech/FLUX-military": "https://huggingface.co/spaces/aiqtech/FLUX-military",
"fantaxy/Rolls-Royce": "https://huggingface.co/spaces/fantaxy/Rolls-Royce",
"seawolf2357/flux-korea-hanbok-lora": "https://huggingface.co/spaces/seawolf2357/flux-korea-hanbok-lora",
"seawolf2357/flux-korea-palace-lora": "https://huggingface.co/spaces/seawolf2357/flux-korea-palace-lora",
"aiqcamp/flux-cat-lora": "https://huggingface.co/spaces/aiqcamp/flux-cat-lora",
"gunship999/SexyImages": "https://huggingface.co/spaces/gunship999/SexyImages",
"aiqtech/flux-claude-monet-lora": "https://huggingface.co/spaces/aiqtech/flux-claude-monet-lora",
"seawolf2357/3D-Avatar-Generator": "https://huggingface.co/spaces/seawolf2357/3D-Avatar-Generator",
"fantaxy/playground25": "https://huggingface.co/spaces/fantaxy/playground25",
"openfree/ultpixgen": "https://huggingface.co/spaces/openfree/ultpixgen",
"seawolf2357/REALVISXL-V5": "https://huggingface.co/spaces/seawolf2357/REALVISXL-V5",
"fantos/flxcontrol": "https://huggingface.co/spaces/fantos/flxcontrol",
"fantos/textcutobject": "https://huggingface.co/spaces/fantos/textcutobject",
"ginipick/FLUX-Prompt-Generator": "https://huggingface.co/spaces/ginipick/FLUX-Prompt-Generator",
"fantaxy/flxloraexp": "https://huggingface.co/spaces/fantaxy/flxloraexp",
"fantos/flxloraexp": "https://huggingface.co/spaces/fantos/flxloraexp",
"seawolf2357/flxloraexp": "https://huggingface.co/spaces/seawolf2357/flxloraexp",
"ginipick/flxloraexp": "https://huggingface.co/spaces/ginipick/flxloraexp",
"aiqcamp/imagemagic": "https://huggingface.co/spaces/aiqcamp/imagemagic",
"openfree/ColorRevive": "https://huggingface.co/spaces/openfree/ColorRevive",
"VIDraft/RAGOndevice": "https://huggingface.co/spaces/VIDraft/RAGOndevice",
"aiqcamp/AudioLlama": "https://huggingface.co/spaces/aiqcamp/AudioLlama",
"ginigen/FLUXllama-Multilingual": "https://huggingface.co/spaces/ginigen/FLUXllama-Multilingual",
"ginipick/FitGen": "https://huggingface.co/spaces/ginipick/FitGen",
"fantaxy/FLUX-Animations": "https://huggingface.co/spaces/fantaxy/FLUX-Animations",
"fantaxy/Remove-Video-Background": "https://huggingface.co/spaces/fantaxy/Remove-Video-Background",
"fantaxy/ofai-flx-logo": "https://huggingface.co/spaces/fantaxy/ofai-flx-logo",
"fantaxy/flx-pulid": "https://huggingface.co/spaces/fantaxy/flx-pulid",
"fantaxy/flx-upscale": "https://huggingface.co/spaces/fantaxy/flx-upscale",
"aiqcamp/Fashion-FLUX": "https://huggingface.co/spaces/aiqcamp/Fashion-FLUX",
"fantos/x-mas": "https://huggingface.co/spaces/fantos/x-mas",
"openfree/Korean-Leaderboard": "https://huggingface.co/spaces/openfree/Korean-Leaderboard",
"ginipick/FLUXllama": "https://huggingface.co/spaces/ginipick/FLUXllama",
"fantaxy/Sound-AI-SFX": "https://huggingface.co/spaces/fantaxy/Sound-AI-SFX",
"fantos/flx8lora": "https://huggingface.co/spaces/fantos/flx8lora",
"openfree/trending-board": "https://huggingface.co/spaces/openfree/trending-board",
"ginipick/Realtime-FLUX": "https://huggingface.co/spaces/ginipick/Realtime-FLUX",
"aiqtech/kofaceid": "https://huggingface.co/spaces/aiqtech/kofaceid",
"fantaxy/fastvideogena": "https://huggingface.co/spaces/fantaxy/fastvideogen",
"fantos/flxfashmodel": "https://huggingface.co/spaces/fantos/flxfashmodel",
"fantos/kolcontrl": "https://huggingface.co/spaces/fantos/kolcontrl",
"aiqtech/cinevid": "https://huggingface.co/spaces/aiqtech/cinevid",
"aiqtech/FLUX-Ghibli-Studio-LoRA": "https://huggingface.co/spaces/aiqtech/FLUX-Ghibli-Studio-LoRA",
"aiqtech/flxgif": "https://huggingface.co/spaces/aiqtech/flxgif",
"aiqtech/imaginpaint": "https://huggingface.co/spaces/aiqtech/imaginpaint"
};
// 2. 별도 객체: 프로젝트의 개별 카테고리 지정 (없으면 기본값 "Image Gen" 사용)
const customCategories = {
"ginipick/spaces-research-korea": "Productivity",
"openfree/Datasets-Convertor": "Utility",
"VIDraft/mouse-Visual-Chat": "Productivity",
"VIDraft/mouse-file-chat": "Productivity",
"openfree/Parquet-CSV-Convertor": "Utility",
"ginigen/FLUX-Eternity": "Image Gen",
"ginipick/live-detect-pose": "Productivity",
"ginigen/OmniParser-v2-pro": "Vision",
"ginigen/Celebrity": "Image Gen",
"ginigen/Fashion-Pose-Control": "Productivity",
"ginigen/zonos-longform": "Audio",
"ginigen/Ovis2-8B": "Vision",
"ginigen/Workflow-Canvas": "Productivity",
"ginigen/Design": "Productivity",
"ginigen/Diagram": "Productivity",
"ginigen/Mockup": "Productivity",
"ginigen/Infographic": "Productivity",
"ginigen/Flowchart": "Productivity",
"aiqcamp/FLUX-Vision ": "Productivity",
"ginigen/VoiceClone-TTS": "Audio",
"fantos/Panorama": "Image Gen",
"ginigen/Multi-LoRAgen": "Image Gen",
"ginigen/canvas-studio": "Image Edit",
"ginipick/Fashion-Stylegen": "Productivity",
"ginipick/Time-Stream": "Video",
"ginipick/AccuVision-Diffusion": "Image Gen",
"fantos/Magic-Drawings": "Image Edit",
"ginigen/Lumina-Image-PLUS": "Image Gen",
"fantaxy/fantasy-novel": "Text",
"fantaxy/eros": "Text",
"fantaxy/adult-novel": "Text",
"fantaxy/kungfu-novel": "Text",
"fantaxy/love-novel": "Text",
"VIDraft/mouse-webgen": "Productivity",
"immunobiotech/MUSIC-Jukebox": "Audio",
"seawolf2357/Flowise-AI": "Productivity",
"ginigen/Flux-LayerDiffuse": "Image Gen",
"VIDraft/Portrait-Animation": "Video",
"VIDraft/Deepseek-Multimodal": "Vision",
"VIDraft/BLIP2": "Image Gen",
"ginigen/text3d-r1": "Image Gen",
"immunobiotech/drug-discovery": "Productivity",
"openfree/VisionOCR-Chat": "Vision",
"immunobiotech/MICHELIN": "Productivity",
"immunobiotech/MICHELIN-korea": "Productivity",
"immunobiotech/MICHELIN-japan": "Productivity",
"immunobiotech/MICHELIN-china": "Productivity",
"VIDraft/money-radar-korea": "Productivity",
"VIDraft/money-radar": "Productivity",
"ginipick/PharmAI-Korea": "Productivity",
"ginigen/MagicFace-V3": "Image Gen",
"aiqcamp/MindMap": "Image Gen",
"ginigen/3D-LLAMA": "Productivity",
"openfree/VectorFlow": "Image Edit",
"openfree/webtoon-gen": "Image Gen",
"VIDraft/topic-prediction": "Text",
"VIDraft/PapersImpact": "Productivity",
"VIDraft/EveryRAG": "Text",
"VIDraft/korea-president-DJ": "Image Gen",
"VIDraft/korea-president-PARK": "Image Gen",
"openfree/image-to-vector": "Image Edit",
"ginipick/QR-Canvas-plus": "Productivity",
"ginigen/text3d-R1": "Image Gen",
"openfree/MagicFace-V3": "Image Edit",
"ginipick/DeepSeekR1-LIVE": "Text",
"ginigen/ColPali-multi": "Text",
"ginigen/Janus-Pro-7B": "Vision",
"ginigen/Animagine": "Image Gen",
"openfree/PDF-RAG": "Productivity",
"fantos/Ranking-Tracker": "Utility",
"aiqcamp/Multilingual-Images": "Image Gen",
"aiqcamp/Gemini2-Flash-Thinking": "Text",
"openfree/pepe": "Image Gen",
"openfree/korea-president-yoon": "Image Gen",
"openfree/CryptoVision": "Utility",
"fantos/VoiceClone": "Audio",
"seawolf2357/ocrlatex": "Utility",
"seawolf2357/img2vid": "Video",
"seawolf2357/sd-prompt-gen": "Text",
"openfree/tarotcard": "Utility",
"aiqcamp/Polaroid": "Image Gen",
"ginigen/cartoon": "Image Gen",
"ginigen/Book-Cover": "Image Gen",
"aiqcamp/fash": "Productivity",
"gunship999/Korea-Daily-News": "Utility",
"immunobiotech/ChicagoGallery": "Utility",
"immunobiotech/MetropolitanMuseum": "Utility",
"immunobiotech/opensky": "Utility",
"VIDraft/eum": "Text",
"aiqtech/FLUX-military": "Image Gen",
"fantaxy/Rolls-Royce": "Image Gen",
"seawolf2357/flux-korea-hanbok-lora": "Image Gen",
"seawolf2357/flux-korea-palace-lora": "Image Gen",
"aiqcamp/flux-cat-lora": "Image Gen",
"gunship999/SexyImages": "Image Gen",
"aiqtech/flux-claude-monet-lora": "Image Gen",
"seawolf2357/3D-Avatar-Generator": "Utility",
"fantaxy/playground25": "Image Gen",
"openfree/ultpixgen": "Image Gen",
"seawolf2357/REALVISXL-V5": "Image Gen",
"fantos/flxcontrol": "Image Edit",
"fantos/textcutobject": "Image Edit",
"ginipick/FLUX-Prompt-Generator": "Text",
"fantaxy/flxloraexp": "Image Gen",
"fantos/flxloraexp": "Image Gen",
"seawolf2357/flxloraexp": "Image Gen",
"ginipick/flxloraexp": "Image Gen",
"aiqcamp/imagemagic": "Image Edit",
"openfree/ColorRevive": "Image Edit",
"VIDraft/RAGOndevice": "Productivity",
"aiqcamp/AudioLlama": "Audio",
"ginigen/FLUXllama-Multilingual": "Image Gen",
"ginipick/FitGen": "Image Gen",
"fantaxy/FLUX-Animations": "Image Gen",
"fantaxy/Remove-Video-Background": "Image Edit",
"fantaxy/ofai-flx-logo": "Image Gen",
"fantaxy/flx-pulid": "Image Gen",
"fantaxy/flx-upscale": "Image Edit",
"aiqcamp/Fashion-FLUX": "Image Gen",
"fantos/x-mas": "Image Gen",
"openfree/Korean-Leaderboard": "Utility",
"ginipick/FLUXllama": "Image Gen",
"fantaxy/Sound-AI-SFX": "Audio",
"fantos/flx8lora": "Image Gen",
"openfree/trending-board": "Utility",
"ginipick/Realtime-FLUX": "Image Gen",
"aiqtech/kofaceid": "Image Gen",
"fantaxy/fastvideogena": "Video",
"fantos/cogvidx": "Video",
"fantos/flxfashmodel": "Image Gen",
"fantos/kolcontrl": "Image Edit",
"aiqtech/cinevid": "Video",
"aiqtech/FLUX-Ghibli-Studio-LoRA": "Image Gen",
"aiqtech/flxgif": "Image Gen",
"aiqtech/imaginpaint": "Image Edit"
};
const newProjects = [
"ginigen/OmniParser-v2-pro",
"ginigen/Celebrity",
"ginigen/Fashion-Pose-Control",
"openfree/Parquet-CSV-Convertor",
"ginigen/zonos-longform",
"ginigen/Ovis2-8B",
"ginigen/Design",
"ginigen/Diagram",
"ginigen/Mockup",
"ginigen/Infographic",
"ginigen/Flowchart",
"aiqcamp/FLUX-Vision",
"fantos/Panorama",
"ginigen/Multi-LoRAgen",
"ginigen/canvas-studio",
"ginipick/Fashion-Stylegen",
"ginipick/Time-Stream",
"ginipick/AccuVision-Diffusion",
"fantos/Magic-Drawings",
"ginigen/Lumina-Image-PLUS",
"fantaxy/fantasy-novel",
"fantaxy/eros",
"fantaxy/adult-novel",
"fantaxy/kungfu-novel",
"fantaxy/love-novel",
"VIDraft/mouse-webgen",
"immunobiotech/MUSIC-Jukebox",
"seawolf2357/Flowise-AI",
"ginigen/Flux-LayerDiffuse",
"VIDraft/Portrait-Animation",
"VIDraft/Deepseek-Multimodal",
"VIDraft/BLIP2",
"ginigen/text3d-r1",
"immunobiotech/drug-discovery",
"openfree/VisionOCR-Chat",
"immunobiotech/MICHELIN",
"immunobiotech/MICHELIN-korea",
"immunobiotech/MICHELIN-japan",
"immunobiotech/MICHELIN-china",
"VIDraft/money-radar-korea",
"VIDraft/money-radar",
"ginipick/PharmAI-Korea",
"ginigen/MagicFace-V3",
"aiqcamp/MindMap",
"ginigen/3D-LLAMA",
"openfree/VectorFlow",
"openfree/webtoon-gen",
"VIDraft/topic-prediction",
"VIDraft/PapersImpact",
"VIDraft/EveryRAG",
"VIDraft/korea-president-DJ",
"VIDraft/korea-president-PARK",
"openfree/image-to-vector",
"ginipick/QR-Canvas-plus",
"openfree/MagicFace-V3",
"ginipick/DeepSeekR1-LIVE",
"ginigen/ColPali-multi",
"ginigen/Janus-Pro-7B",
"ginigen/Animagine",
"openfree/PDF-RAG",
"fantos/Ranking-Tracker",
"aiqcamp/Multilingual-Images",
"aiqcamp/Gemini2-Flash-Thinking",
"openfree/pepe",
"openfree/korea-president-yoon",
"openfree/CryptoVision",
"fantos/VoiceClone",
"seawolf2357/ocrlatex",
"seawolf2357/img2vid",
"seawolf2357/sd-prompt-gen",
"openfree/tarotcard",
"aiqcamp/Polaroid",
"ginigen/cartoon",
"ginigen/Book-Cover"
];
const bestProjects = [
"ginipick/spaces-research-korea",
"VIDraft/mouse-Visual-Chat",
"VIDraft/mouse-file-chat",
"openfree/Datasets-Convertor",
"ginipick/live-detect-pose",
"ginigen/FLUX-Eternity",
"ginigen/Workflow-Canvas",
"ginigen/VoiceClone-TTS",
"openfree/VisionOCR-Chat",
"ginigen/3D-LLAMA",
"fantos/Ranking-Tracker",
"openfree/trending-board",
"openfree/Korean-Leaderboard",
"fantos/Panorama",
"ginigen/Multi-LoRAgen",
"ginigen/canvas-studio",
"fantaxy/adult-novel",
"VIDraft/mouse-webgen",
"ginigen/text3d-r1",
"immunobiotech/MICHELIN-korea",
"VIDraft/money-radar-korea",
"ginipick/PharmAI-Korea",
"VIDraft/PapersImpact",
"aiqcamp/MindMap",
"VIDraft/EveryRAG",
"openfree/MagicFace-V3",
"ginigen/Animagine",
"openfree/PDF-RAG",
"aiqcamp/Multilingual-Images",
"aiqcamp/Gemini2-Flash-Thinking",
"openfree/CryptoVision",
"fantos/VoiceClone",
"seawolf2357/ocrlatex",
"ginigen/cartoon",
"ginigen/Book-Cover",
"aiqcamp/fash",
"seawolf2357/REALVISXL-V5",
"aiqcamp/AudioLlama",
"ginigen/FLUXllama-Multilingual",
"ginipick/FitGen"
];
// 4. URL 변환 함수
function transformUrl(url) {
const prefix = "https://huggingface.co/spaces/";
if (url.startsWith(prefix)) {
const rest = url.substring(prefix.length);
return "https://" + rest.replace("/", "-") + ".hf.space";
}
return url;
}
// 5. 프로젝트 배열 생성
const keys = Object.keys(projectList);
const projects = keys.map(key => {
const primaryCategory = customCategories[key] || "Image Gen";
let categories = [primaryCategory];
if (newProjects.includes(key)) categories.push("NEW");
if (bestProjects.includes(key)) categories.push("BEST");
return {
name: primaryCategory + "/" + key.split("/")[1],
url: transformUrl(projectList[key]),
categories: categories
};
});
// 6. 카테고리별 그룹화
const grouped = {};
projects.forEach(proj => {
proj.categories.forEach(cat => {
if (!grouped[cat]) grouped[cat] = [];
grouped[cat].push(proj);
});
});
// 7. 필터 버튼 생성
const fixedGroups = ["NEW", "BEST", "Text", "Image Gen", "Image Edit", "Audio", "Video", "Productivity", "Utility", "Vision"];
const filterGroupDiv = document.getElementById("filter-group");
const allButton = document.createElement("button");
allButton.className = "toggle-button active";
allButton.setAttribute("data-filter", "all");
allButton.textContent = "All";
filterGroupDiv.appendChild(allButton);
fixedGroups.forEach(category => {
const btn = document.createElement("button");
btn.className = "toggle-button";
btn.setAttribute("data-filter", category);
btn.textContent = category;
filterGroupDiv.appendChild(btn);
});
// 8. 사이드바 갱신 함수
function updateSidebar(filter) {
const sidebar = document.getElementById("sidebar");
sidebar.innerHTML = "";
let items = (filter === "all")
? projects
: projects.filter(p => p.categories.includes(filter));
const ul = document.createElement("ul");
items.forEach(item => {
const li = document.createElement("li");
// 이름 표시
const nameSpan = document.createElement("span");
nameSpan.textContent = item.name;
li.appendChild(nameSpan);
// "링크 클릭" 버튼
const linkButton = document.createElement("button");
linkButton.textContent = "링크 클릭";
linkButton.addEventListener("click", (event) => {
event.stopPropagation(); // li 클릭 이벤트와 구분
window.open(item.url, "_blank"); // 새 탭(창) 열기
});
li.appendChild(linkButton);
// li 자체 클릭하면 iframe 변경
li.addEventListener("click", () => {
document.getElementById("embed-frame").src = item.url;
});
ul.appendChild(li);
});
sidebar.appendChild(ul);
if (items.length > 0) {
document.getElementById("embed-frame").src = items[0].url;
} else {
document.getElementById("embed-frame").src = "";
}
}
// 9. 버튼 클릭 이벤트
document.querySelectorAll(".toggle-button").forEach(button => {
button.addEventListener("click", function() {
document.querySelectorAll(".toggle-button").forEach(b => b.classList.remove("active"));
this.classList.add("active");
updateSidebar(this.getAttribute("data-filter"));
});
});
// 10. 페이지 로드 시 All 필터
updateSidebar("all");
</script>
</body>
</html>