Spaces:
Running
Running
Update index.html
Browse files- index.html +54 -1
index.html
CHANGED
@@ -118,6 +118,18 @@
|
|
118 |
<script>
|
119 |
// 1. ํ๋ก์ ํธ URL ๋ชฉ๋ก: ํ๋ก์ ํธ ์ด๋ฆ -> URL
|
120 |
const projectList = {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
121 |
"ginigen/Workflow-Canvas": "https://huggingface.co/spaces/ginigen/Workflow-Canvas",
|
122 |
"ginigen/Design": "https://huggingface.co/spaces/ginigen/Design",
|
123 |
"ginigen/Diagram": "https://huggingface.co/spaces/ginigen/Diagram",
|
@@ -240,15 +252,26 @@
|
|
240 |
"aiqtech/flxgif": "https://huggingface.co/spaces/aiqtech/flxgif",
|
241 |
"aiqtech/imaginpaint": "https://huggingface.co/spaces/aiqtech/imaginpaint"
|
242 |
};
|
|
|
243 |
// 2. ๋ณ๋ ๊ฐ์ฒด: ํ๋ก์ ํธ์ ๊ฐ๋ณ ์นดํ
๊ณ ๋ฆฌ ์ง์ (์์ผ๋ฉด ๊ธฐ๋ณธ๊ฐ "Image Gen" ์ฌ์ฉ)
|
244 |
const customCategories = {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
245 |
"ginigen/Workflow-Canvas": "Productivity",
|
246 |
"ginigen/Design": "Productivity",
|
247 |
"ginigen/Diagram": "Productivity",
|
248 |
"ginigen/Mockup": "Productivity",
|
249 |
"ginigen/Infographic": "Productivity",
|
250 |
"ginigen/Flowchart": "Productivity",
|
251 |
-
|
252 |
"aiqcamp/FLUX-Vision ": "Productivity",
|
253 |
"ginigen/VoiceClone-TTS": "Audio",
|
254 |
"fantos/Panorama": "Image Gen",
|
@@ -367,8 +390,15 @@
|
|
367 |
"aiqtech/flxgif": "Image Gen",
|
368 |
"aiqtech/imaginpaint": "Image Edit"
|
369 |
|
|
|
370 |
};
|
|
|
371 |
const newProjects = [
|
|
|
|
|
|
|
|
|
|
|
372 |
"ginigen/Design",
|
373 |
"ginigen/Diagram",
|
374 |
"ginigen/Mockup",
|
@@ -438,7 +468,13 @@ const newProjects = [
|
|
438 |
"ginigen/cartoon",
|
439 |
"ginigen/Book-Cover"
|
440 |
];
|
|
|
441 |
const bestProjects = [
|
|
|
|
|
|
|
|
|
|
|
442 |
"ginigen/Workflow-Canvas",
|
443 |
"ginigen/VoiceClone-TTS",
|
444 |
"openfree/VisionOCR-Chat",
|
@@ -474,6 +510,8 @@ const bestProjects = [
|
|
474 |
"ginigen/FLUXllama-Multilingual",
|
475 |
"ginipick/FitGen"
|
476 |
];
|
|
|
|
|
477 |
// 4. URL ๋ณํ ํจ์
|
478 |
function transformUrl(url) {
|
479 |
const prefix = "https://huggingface.co/spaces/";
|
@@ -483,6 +521,7 @@ const bestProjects = [
|
|
483 |
}
|
484 |
return url;
|
485 |
}
|
|
|
486 |
// 5. ํ๋ก์ ํธ ๋ฐฐ์ด ์์ฑ
|
487 |
const keys = Object.keys(projectList);
|
488 |
const projects = keys.map(key => {
|
@@ -491,12 +530,14 @@ const bestProjects = [
|
|
491 |
|
492 |
if (newProjects.includes(key)) categories.push("NEW");
|
493 |
if (bestProjects.includes(key)) categories.push("BEST");
|
|
|
494 |
return {
|
495 |
name: primaryCategory + "/" + key.split("/")[1],
|
496 |
url: transformUrl(projectList[key]),
|
497 |
categories: categories
|
498 |
};
|
499 |
});
|
|
|
500 |
// 6. ์นดํ
๊ณ ๋ฆฌ๋ณ ๊ทธ๋ฃนํ
|
501 |
const grouped = {};
|
502 |
projects.forEach(proj => {
|
@@ -505,14 +546,17 @@ const bestProjects = [
|
|
505 |
grouped[cat].push(proj);
|
506 |
});
|
507 |
});
|
|
|
508 |
// 7. ํํฐ ๋ฒํผ ์์ฑ
|
509 |
const fixedGroups = ["NEW", "BEST", "Text", "Image Gen", "Image Edit", "Audio", "Video", "Productivity", "Utility", "Vision"];
|
510 |
const filterGroupDiv = document.getElementById("filter-group");
|
|
|
511 |
const allButton = document.createElement("button");
|
512 |
allButton.className = "toggle-button active";
|
513 |
allButton.setAttribute("data-filter", "all");
|
514 |
allButton.textContent = "All";
|
515 |
filterGroupDiv.appendChild(allButton);
|
|
|
516 |
fixedGroups.forEach(category => {
|
517 |
const btn = document.createElement("button");
|
518 |
btn.className = "toggle-button";
|
@@ -520,6 +564,7 @@ const bestProjects = [
|
|
520 |
btn.textContent = category;
|
521 |
filterGroupDiv.appendChild(btn);
|
522 |
});
|
|
|
523 |
// 8. ์ฌ์ด๋๋ฐ ๊ฐฑ์ ํจ์
|
524 |
function updateSidebar(filter) {
|
525 |
const sidebar = document.getElementById("sidebar");
|
@@ -527,13 +572,16 @@ const bestProjects = [
|
|
527 |
let items = (filter === "all")
|
528 |
? projects
|
529 |
: projects.filter(p => p.categories.includes(filter));
|
|
|
530 |
const ul = document.createElement("ul");
|
531 |
items.forEach(item => {
|
532 |
const li = document.createElement("li");
|
|
|
533 |
// ์ด๋ฆ ํ์
|
534 |
const nameSpan = document.createElement("span");
|
535 |
nameSpan.textContent = item.name;
|
536 |
li.appendChild(nameSpan);
|
|
|
537 |
// "๋งํฌ ํด๋ฆญ" ๋ฒํผ
|
538 |
const linkButton = document.createElement("button");
|
539 |
linkButton.textContent = "๋งํฌ ํด๋ฆญ";
|
@@ -542,19 +590,23 @@ const bestProjects = [
|
|
542 |
window.open(item.url, "_blank"); // ์ ํญ(์ฐฝ) ์ด๊ธฐ
|
543 |
});
|
544 |
li.appendChild(linkButton);
|
|
|
545 |
// li ์์ฒด ํด๋ฆญํ๋ฉด iframe ๋ณ๊ฒฝ
|
546 |
li.addEventListener("click", () => {
|
547 |
document.getElementById("embed-frame").src = item.url;
|
548 |
});
|
|
|
549 |
ul.appendChild(li);
|
550 |
});
|
551 |
sidebar.appendChild(ul);
|
|
|
552 |
if (items.length > 0) {
|
553 |
document.getElementById("embed-frame").src = items[0].url;
|
554 |
} else {
|
555 |
document.getElementById("embed-frame").src = "";
|
556 |
}
|
557 |
}
|
|
|
558 |
// 9. ๋ฒํผ ํด๋ฆญ ์ด๋ฒคํธ
|
559 |
document.querySelectorAll(".toggle-button").forEach(button => {
|
560 |
button.addEventListener("click", function() {
|
@@ -563,6 +615,7 @@ const bestProjects = [
|
|
563 |
updateSidebar(this.getAttribute("data-filter"));
|
564 |
});
|
565 |
});
|
|
|
566 |
// 10. ํ์ด์ง ๋ก๋ ์ All ํํฐ
|
567 |
updateSidebar("all");
|
568 |
</script>
|
|
|
118 |
<script>
|
119 |
// 1. ํ๋ก์ ํธ URL ๋ชฉ๋ก: ํ๋ก์ ํธ ์ด๋ฆ -> URL
|
120 |
const projectList = {
|
121 |
+
|
122 |
+
"VIDraft/mouse-Visual-Chat": "https://huggingface.co/spaces/VIDraft/mouse-Visual-Chat",
|
123 |
+
"VIDraft/mouse-file-chat": "https://huggingface.co/spaces/VIDraft/mouse-file-chat",
|
124 |
+
"openfree/Parquet-CSV-Convertor": "https://huggingface.co/spaces/openfree/Parquet-CSV-Convertor",
|
125 |
+
"ginigen/FLUX-Eternity": "https://huggingface.co/spaces/ginigen/FLUX-Eternity",
|
126 |
+
"ginipick/live-detect-pose": "https://huggingface.co/spaces/ginipick/live-detect-pose",
|
127 |
+
"ginigen/OmniParser-v2-pro": "https://huggingface.co/spaces/ginigen/OmniParser-v2-pro",
|
128 |
+
"ginigen/Celebrity": "https://huggingface.co/spaces/ginigen/Celebrity",
|
129 |
+
"ginigen/Fashion-Pose-Control": "https://huggingface.co/spaces/ginigen/Fashion-Pose-Control",
|
130 |
+
"ginigen/zonos-longform": "https://huggingface.co/spaces/ginigen/zonos-longform",
|
131 |
+
"ginigen/Ovis2-8B": "https://huggingface.co/spaces/ginigen/Ovis2-8B",
|
132 |
+
|
133 |
"ginigen/Workflow-Canvas": "https://huggingface.co/spaces/ginigen/Workflow-Canvas",
|
134 |
"ginigen/Design": "https://huggingface.co/spaces/ginigen/Design",
|
135 |
"ginigen/Diagram": "https://huggingface.co/spaces/ginigen/Diagram",
|
|
|
252 |
"aiqtech/flxgif": "https://huggingface.co/spaces/aiqtech/flxgif",
|
253 |
"aiqtech/imaginpaint": "https://huggingface.co/spaces/aiqtech/imaginpaint"
|
254 |
};
|
255 |
+
|
256 |
// 2. ๋ณ๋ ๊ฐ์ฒด: ํ๋ก์ ํธ์ ๊ฐ๋ณ ์นดํ
๊ณ ๋ฆฌ ์ง์ (์์ผ๋ฉด ๊ธฐ๋ณธ๊ฐ "Image Gen" ์ฌ์ฉ)
|
257 |
const customCategories = {
|
258 |
+
"VIDraft/mouse-Visual-Chat": "Productivity",
|
259 |
+
"VIDraft/mouse-file-chat": "Productivity",
|
260 |
+
"openfree/Parquet-CSV-Convertor": "Utility",
|
261 |
+
"ginigen/FLUX-Eternity": "Image Gen",
|
262 |
+
"ginipick/live-detect-pose": "Productivity",
|
263 |
+
"ginigen/OmniParser-v2-pro": "Vision",
|
264 |
+
"ginigen/Celebrity": "Image Gen",
|
265 |
+
"ginigen/Fashion-Pose-Control": "Productivity",
|
266 |
+
"ginigen/zonos-longform": "Audio",
|
267 |
+
"ginigen/Ovis2-8B": "Vision",
|
268 |
+
|
269 |
"ginigen/Workflow-Canvas": "Productivity",
|
270 |
"ginigen/Design": "Productivity",
|
271 |
"ginigen/Diagram": "Productivity",
|
272 |
"ginigen/Mockup": "Productivity",
|
273 |
"ginigen/Infographic": "Productivity",
|
274 |
"ginigen/Flowchart": "Productivity",
|
|
|
275 |
"aiqcamp/FLUX-Vision ": "Productivity",
|
276 |
"ginigen/VoiceClone-TTS": "Audio",
|
277 |
"fantos/Panorama": "Image Gen",
|
|
|
390 |
"aiqtech/flxgif": "Image Gen",
|
391 |
"aiqtech/imaginpaint": "Image Edit"
|
392 |
|
393 |
+
|
394 |
};
|
395 |
+
|
396 |
const newProjects = [
|
397 |
+
"ginigen/OmniParser-v2-pro",
|
398 |
+
"ginigen/Celebrity",
|
399 |
+
"ginigen/Fashion-Pose-Control",
|
400 |
+
"ginigen/zonos-longform",
|
401 |
+
"ginigen/Ovis2-8B",
|
402 |
"ginigen/Design",
|
403 |
"ginigen/Diagram",
|
404 |
"ginigen/Mockup",
|
|
|
468 |
"ginigen/cartoon",
|
469 |
"ginigen/Book-Cover"
|
470 |
];
|
471 |
+
|
472 |
const bestProjects = [
|
473 |
+
"VIDraft/mouse-Visual-Chat",
|
474 |
+
"VIDraft/mouse-file-chat",
|
475 |
+
"ginipick/live-detect-pose",
|
476 |
+
"ginigen/FLUX-Eternity",
|
477 |
+
"openfree/Parquet-CSV-Convertor",
|
478 |
"ginigen/Workflow-Canvas",
|
479 |
"ginigen/VoiceClone-TTS",
|
480 |
"openfree/VisionOCR-Chat",
|
|
|
510 |
"ginigen/FLUXllama-Multilingual",
|
511 |
"ginipick/FitGen"
|
512 |
];
|
513 |
+
|
514 |
+
|
515 |
// 4. URL ๋ณํ ํจ์
|
516 |
function transformUrl(url) {
|
517 |
const prefix = "https://huggingface.co/spaces/";
|
|
|
521 |
}
|
522 |
return url;
|
523 |
}
|
524 |
+
|
525 |
// 5. ํ๋ก์ ํธ ๋ฐฐ์ด ์์ฑ
|
526 |
const keys = Object.keys(projectList);
|
527 |
const projects = keys.map(key => {
|
|
|
530 |
|
531 |
if (newProjects.includes(key)) categories.push("NEW");
|
532 |
if (bestProjects.includes(key)) categories.push("BEST");
|
533 |
+
|
534 |
return {
|
535 |
name: primaryCategory + "/" + key.split("/")[1],
|
536 |
url: transformUrl(projectList[key]),
|
537 |
categories: categories
|
538 |
};
|
539 |
});
|
540 |
+
|
541 |
// 6. ์นดํ
๊ณ ๋ฆฌ๋ณ ๊ทธ๋ฃนํ
|
542 |
const grouped = {};
|
543 |
projects.forEach(proj => {
|
|
|
546 |
grouped[cat].push(proj);
|
547 |
});
|
548 |
});
|
549 |
+
|
550 |
// 7. ํํฐ ๋ฒํผ ์์ฑ
|
551 |
const fixedGroups = ["NEW", "BEST", "Text", "Image Gen", "Image Edit", "Audio", "Video", "Productivity", "Utility", "Vision"];
|
552 |
const filterGroupDiv = document.getElementById("filter-group");
|
553 |
+
|
554 |
const allButton = document.createElement("button");
|
555 |
allButton.className = "toggle-button active";
|
556 |
allButton.setAttribute("data-filter", "all");
|
557 |
allButton.textContent = "All";
|
558 |
filterGroupDiv.appendChild(allButton);
|
559 |
+
|
560 |
fixedGroups.forEach(category => {
|
561 |
const btn = document.createElement("button");
|
562 |
btn.className = "toggle-button";
|
|
|
564 |
btn.textContent = category;
|
565 |
filterGroupDiv.appendChild(btn);
|
566 |
});
|
567 |
+
|
568 |
// 8. ์ฌ์ด๋๋ฐ ๊ฐฑ์ ํจ์
|
569 |
function updateSidebar(filter) {
|
570 |
const sidebar = document.getElementById("sidebar");
|
|
|
572 |
let items = (filter === "all")
|
573 |
? projects
|
574 |
: projects.filter(p => p.categories.includes(filter));
|
575 |
+
|
576 |
const ul = document.createElement("ul");
|
577 |
items.forEach(item => {
|
578 |
const li = document.createElement("li");
|
579 |
+
|
580 |
// ์ด๋ฆ ํ์
|
581 |
const nameSpan = document.createElement("span");
|
582 |
nameSpan.textContent = item.name;
|
583 |
li.appendChild(nameSpan);
|
584 |
+
|
585 |
// "๋งํฌ ํด๋ฆญ" ๋ฒํผ
|
586 |
const linkButton = document.createElement("button");
|
587 |
linkButton.textContent = "๋งํฌ ํด๋ฆญ";
|
|
|
590 |
window.open(item.url, "_blank"); // ์ ํญ(์ฐฝ) ์ด๊ธฐ
|
591 |
});
|
592 |
li.appendChild(linkButton);
|
593 |
+
|
594 |
// li ์์ฒด ํด๋ฆญํ๋ฉด iframe ๋ณ๊ฒฝ
|
595 |
li.addEventListener("click", () => {
|
596 |
document.getElementById("embed-frame").src = item.url;
|
597 |
});
|
598 |
+
|
599 |
ul.appendChild(li);
|
600 |
});
|
601 |
sidebar.appendChild(ul);
|
602 |
+
|
603 |
if (items.length > 0) {
|
604 |
document.getElementById("embed-frame").src = items[0].url;
|
605 |
} else {
|
606 |
document.getElementById("embed-frame").src = "";
|
607 |
}
|
608 |
}
|
609 |
+
|
610 |
// 9. ๋ฒํผ ํด๋ฆญ ์ด๋ฒคํธ
|
611 |
document.querySelectorAll(".toggle-button").forEach(button => {
|
612 |
button.addEventListener("click", function() {
|
|
|
615 |
updateSidebar(this.getAttribute("data-filter"));
|
616 |
});
|
617 |
});
|
618 |
+
|
619 |
// 10. ํ์ด์ง ๋ก๋ ์ All ํํฐ
|
620 |
updateSidebar("all");
|
621 |
</script>
|