Spaces:
Running
Running
Update index.html
Browse files- index.html +93 -93
index.html
CHANGED
|
@@ -28,14 +28,14 @@
|
|
| 28 |
<li class="nav-item"><a class="nav-link" href="#optimizations">Math Sorcery</a></li>
|
| 29 |
<li class="nav-item"><a class="nav-link" href="#demo">Demo</a></li>
|
| 30 |
<li class="nav-item"><a class="nav-link" href="#future">Future</a></li>
|
| 31 |
-
<li class="nav-item"><a class="nav-link" href="#installation">
|
| 32 |
<li class="nav-item"><a class="nav-link" href="#usage">Usage</a></li>
|
| 33 |
<li class="nav-item"><a class="nav-link" href="#community">Community</a></li>
|
| 34 |
-
<li class="nav-item"><a class="nav-link" href="#technical">Tech
|
| 35 |
<li class="nav-item"><a class="nav-link" href="#faq">FAQ</a></li>
|
| 36 |
<li class="nav-item"><a class="nav-link" href="#tutorials">Tutorials</a></li>
|
| 37 |
<li class="nav-item"><a class="nav-link" href="#contribute">Contribute</a></li>
|
| 38 |
-
<li class="nav-item"><a class="nav-link" href="#files">
|
| 39 |
<li class="nav-item"><a class="nav-link" href="#screenshots">Screenshots</a></li>
|
| 40 |
</ul>
|
| 41 |
</div>
|
|
@@ -46,14 +46,14 @@
|
|
| 46 |
<section id="home" class="hero-section text-center text-white">
|
| 47 |
<div class="container py-5">
|
| 48 |
<h1 class="display-3 animate__animated animate__zoomIn">👻 GhostPack</h1>
|
| 49 |
-
<p class="lead animate__animated animate__fadeIn animate__delay-1s">Veo 3-Level Video Sorcery for
|
| 50 |
-
<p class="animate__animated animate__fadeIn animate__delay-2s">Unleash
|
| 51 |
<div class="preview-window animate__animated animate__fadeIn animate__delay-3s">
|
| 52 |
-
<img src="https://huggingface.co/spaces/ghostai1/GhostPack/resolve/main/preview_mockup.png" alt="GhostPack Preview" class="img-fluid rounded">
|
| 53 |
-
<p class="mt-2">Preview of ghostgradio.py interface and
|
| 54 |
</div>
|
| 55 |
<div class="mt-4">
|
| 56 |
-
<a href="#installation" class="btn btn-ghost btn-lg animate__animated animate__pulse animate__delay-4s me-3">
|
| 57 |
<a href="https://github.com/ghostai1/GhostPack" class="btn btn-outline-ghost btn-lg animate__animated animate__pulse animate__delay-4s" target="_blank">GitHub 🌟</a>
|
| 58 |
</div>
|
| 59 |
</div>
|
|
@@ -63,13 +63,13 @@
|
|
| 63 |
<section id="features" class="py-5 bg-dark text-white">
|
| 64 |
<div class="container">
|
| 65 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">✨ Spectral Features</h2>
|
| 66 |
-
<p class="lead lead-text mb-4">
|
| 67 |
<div class="row row-cols-1 row-cols-md-3 g-4">
|
| 68 |
<div class="col">
|
| 69 |
<div class="card bg-ghost-card h-100">
|
| 70 |
<div class="card-body text-center">
|
| 71 |
<h3 class="card-title">📹 Veo 3-Level AI</h3>
|
| 72 |
-
<p class="card-text">
|
| 73 |
</div>
|
| 74 |
</div>
|
| 75 |
</div>
|
|
@@ -77,7 +77,7 @@
|
|
| 77 |
<div class="card bg-ghost-card h-100">
|
| 78 |
<div class="card-body text-center">
|
| 79 |
<h3 class="card-title">⚡️ Phantom Speed</h3>
|
| 80 |
-
<p class="card-text">Teacache
|
| 81 |
</div>
|
| 82 |
</div>
|
| 83 |
</div>
|
|
@@ -85,7 +85,7 @@
|
|
| 85 |
<div class="card bg-ghost-card h-100">
|
| 86 |
<div class="card-body text-center">
|
| 87 |
<h3 class="card-title">🛠️ Laptop Domination</h3>
|
| 88 |
-
<p class="card-text">Supports 13B models on
|
| 89 |
</div>
|
| 90 |
</div>
|
| 91 |
</div>
|
|
@@ -93,7 +93,7 @@
|
|
| 93 |
<div class="card bg-ghost-card h-100">
|
| 94 |
<div class="card-body text-center">
|
| 95 |
<h3 class="card-title">🎛️ Custom Workflows</h3>
|
| 96 |
-
<p class="card-text">
|
| 97 |
</div>
|
| 98 |
</div>
|
| 99 |
</div>
|
|
@@ -101,7 +101,7 @@
|
|
| 101 |
<div class="card bg-ghost-card h-100">
|
| 102 |
<div class="card-body text-center">
|
| 103 |
<h3 class="card-title">👁️ Live Preview</h3>
|
| 104 |
-
<p class="card-text">
|
| 105 |
</div>
|
| 106 |
</div>
|
| 107 |
</div>
|
|
@@ -109,7 +109,7 @@
|
|
| 109 |
<div class="card bg-ghost-card h-100">
|
| 110 |
<div class="card-body text-center">
|
| 111 |
<h3 class="card-title">🤝 Open Source</h3>
|
| 112 |
-
<p class="card-text">
|
| 113 |
</div>
|
| 114 |
</div>
|
| 115 |
</div>
|
|
@@ -121,7 +121,7 @@
|
|
| 121 |
<section id="optimizations" class="py-5 bg-dark text-white">
|
| 122 |
<div class="container">
|
| 123 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🧙♂️ Ghostai1’s Math Sorcery</h2>
|
| 124 |
-
<p class="lead lead-text mb-4">
|
| 125 |
<ul class="nav nav-tabs justify-content-center mb-4" id="optTab" role="tablist">
|
| 126 |
<li class="nav-item"><button class="nav-link active" id="speed-tab" data-bs-toggle="tab" data-bs-target="#speed" type="button">⚡️ Speed</button></li>
|
| 127 |
<li class="nav-item"><button class="nav-link" id="memory-tab" data-bs-toggle="tab" data-bs-target="#memory" type="button">🔮 Memory</button></li>
|
|
@@ -131,33 +131,33 @@
|
|
| 131 |
<div class="tab-content" id="optTabContent">
|
| 132 |
<div class="tab-pane fade show active" id="speed" role="tabpanel">
|
| 133 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 134 |
-
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🔮 Teacache</h4><p class="lead-text">
|
| 135 |
-
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🧙♂️ Sage-Attention</h4><p class="lead-text">
|
| 136 |
-
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>⚡ CUDA Tweaks</h4><p class="lead-text">
|
| 137 |
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🚀 Dynamic Scheduling</h4><p class="lead-text">Speeds tasks by ~15-20%, \( T_{\text{sched}} \approx 0.8 \cdot T_{\text{base_sched}} \)</p></div></div></div>
|
| 138 |
</div>
|
| 139 |
</div>
|
| 140 |
<div class="tab-pane fade" id="memory" role="tabpanel">
|
| 141 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 142 |
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🧬 Context Packing</h4><p class="lead-text">Saves ~50% VRAM (~2-3GB), \( M_{\text{VRAM}} \propto O(1) \)</p></div></div></div>
|
| 143 |
-
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>💾 tcmalloc</h4><p class="lead-text">
|
| 144 |
-
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>📦 Memory Cache</h4><p class="lead-text">
|
| 145 |
</div>
|
| 146 |
</div>
|
| 147 |
<div class="tab-pane fade" id="compute" role="tabpanel">
|
| 148 |
<div class="row row-cols-1 g-4">
|
| 149 |
-
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>⚡ Dynamic Batching</h4><p class="lead-text">
|
| 150 |
</div>
|
| 151 |
</div>
|
| 152 |
<div class="tab-pane fade" id="efficiency" role="tabpanel">
|
| 153 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 154 |
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🔋 Power Optimization</h4><p class="lead-text">Saves ~20-30% power, \( P_{\text{idle}} \approx 0.7 \cdot P_{\text{base_idle}} \)</p></div></div></div>
|
| 155 |
-
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🧵 Thread Tuning</h4><p class="lead-text">
|
| 156 |
</div>
|
| 157 |
</div>
|
| 158 |
</div>
|
| 159 |
<div class="row mt-5">
|
| 160 |
-
<div class="col-
|
| 161 |
<h3 class="text-center text-white mb-3">VRAM Requirements 🖥️</h3>
|
| 162 |
<div class="table-responsive">
|
| 163 |
<table class="table table-dark table-bordered">
|
|
@@ -179,19 +179,19 @@
|
|
| 179 |
<section id="demo" class="py-5 bg-dark text-white">
|
| 180 |
<div class="container">
|
| 181 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🎥 Demo Video Showcase</h2>
|
| 182 |
-
<p class="lead lead-text mb-4 animate__animated animate__fadeIn">
|
| 183 |
-
<div class="row">
|
| 184 |
-
<div class="col-md-8
|
| 185 |
<div class="card bg-ghost-card animate__animated animate__fadeIn">
|
| 186 |
-
<div class="card-body text-center">
|
| 187 |
-
<img src="https://cdn-uploads.huggingface.co/production/uploads/6421b1c68adc8881b974a89d/k8pgUlg4OvdUZpbMNTcp5.gif" alt="GhostPack Demo GIF" class="img-fluid rounded" style="max-height: 400px;">
|
| 188 |
-
<p class="mt-3">Sample output from ghostgradio.py,
|
| 189 |
</div>
|
| 190 |
</div>
|
| 191 |
</div>
|
| 192 |
</div>
|
| 193 |
<div class="text-center mt-4">
|
| 194 |
-
<a href="https://github.com/ghostai1/GhostPack/blob/main/demo_videos" class="btn btn-ghost" target="_blank">More Demos 📹</a>
|
| 195 |
</div>
|
| 196 |
</div>
|
| 197 |
</section>
|
|
@@ -200,13 +200,13 @@
|
|
| 200 |
<section id="future" class="py-5 bg-ghost-alt text-dark">
|
| 201 |
<div class="container">
|
| 202 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🌌 Future Spectral Phantoms</h2>
|
| 203 |
-
<p class="lead light-lead-text mb-4">
|
| 204 |
<div class="row row-cols-1 row-cols-md-3 g-4">
|
| 205 |
<div class="col">
|
| 206 |
<div class="card bg-ghost-alt-card h-100">
|
| 207 |
<div class="card-body text-center">
|
| 208 |
<h3 class="card-title">🗣️ Voice Generation</h3>
|
| 209 |
-
<p class="light-lead-text">AI-
|
| 210 |
</div>
|
| 211 |
</div>
|
| 212 |
</div>
|
|
@@ -214,7 +214,7 @@
|
|
| 214 |
<div class="card bg-ghost-alt-card h-100">
|
| 215 |
<div class="card-body text-center">
|
| 216 |
<h3 class="card-title">🖼️ AI Images</h3>
|
| 217 |
-
<p class="light-lead-text">Generates high-quality starting frames with AI-crafted visuals
|
| 218 |
</div>
|
| 219 |
</div>
|
| 220 |
</div>
|
|
@@ -222,7 +222,7 @@
|
|
| 222 |
<div class="card bg-ghost-alt-card h-100">
|
| 223 |
<div class="card-body text-center">
|
| 224 |
<h3 class="card-title">🎮 VR Integration</h3>
|
| 225 |
-
<p class="light-lead-text">
|
| 226 |
</div>
|
| 227 |
</div>
|
| 228 |
</div>
|
|
@@ -234,7 +234,7 @@
|
|
| 234 |
<section id="installation" class="py-5 bg-dark text-white">
|
| 235 |
<div class="container">
|
| 236 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🛠️ Unleash GhostPack</h2>
|
| 237 |
-
<p class="lead lead-text mb-4">
|
| 238 |
<div class="row row-cols-1 row-cols-md-3 g-4">
|
| 239 |
<div class="col">
|
| 240 |
<div class="card bg-ghost-card h-100">
|
|
@@ -244,7 +244,7 @@
|
|
| 244 |
cd GhostPack
|
| 245 |
chmod +x install_ubuntu.sh
|
| 246 |
./install_ubuntu.sh</code></pre>
|
| 247 |
-
<p>Requires NVIDIA GPU, 8GB RAM, Python 3.10, CUDA 12.6.</p>
|
| 248 |
</div>
|
| 249 |
</div>
|
| 250 |
</div>
|
|
@@ -255,7 +255,7 @@ chmod +x install_ubuntu.sh
|
|
| 255 |
<pre><code class="code-block">git clone https://github.com/ghostai1/GhostPack
|
| 256 |
cd GhostPack
|
| 257 |
install.bat</code></pre>
|
| 258 |
-
<p>Auto-downloads >30GB models,
|
| 259 |
</div>
|
| 260 |
</div>
|
| 261 |
</div>
|
|
@@ -267,7 +267,7 @@ install.bat</code></pre>
|
|
| 267 |
cd GhostPack
|
| 268 |
chmod +x install_macos.sh
|
| 269 |
./install_macos.sh</code></pre>
|
| 270 |
-
<p>M1/M2
|
| 271 |
</div>
|
| 272 |
</div>
|
| 273 |
</div>
|
|
@@ -282,7 +282,7 @@ chmod +x install_macos.sh
|
|
| 282 |
<section id="usage" class="py-5 bg-dark text-white">
|
| 283 |
<div class="container">
|
| 284 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">📹 Weave Ghostly Videos</h2>
|
| 285 |
-
<p class="lead lead-text mb-4">
|
| 286 |
<div class="row row-cols-1 g-4">
|
| 287 |
<div class="col">
|
| 288 |
<div class="card bg-ghost-card h-100">
|
|
@@ -291,7 +291,7 @@ chmod +x install_macos.sh
|
|
| 291 |
<pre><code class="code-block">source ~/ghostpack_venv/venv/bin/activate
|
| 292 |
cd ~/ghostpack_venv
|
| 293 |
python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
| 294 |
-
<p>Activates virtual environment and
|
| 295 |
</div>
|
| 296 |
</div>
|
| 297 |
</div>
|
|
@@ -300,10 +300,10 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 300 |
<div class="card-body">
|
| 301 |
<h4>Craft Spells</h4>
|
| 302 |
<ul class="lead-text">
|
| 303 |
-
<li>Upload an image or video frame
|
| 304 |
-
<li>
|
| 305 |
-
<li>Enable teacache for ⚡️ speed and
|
| 306 |
-
<li>
|
| 307 |
</ul>
|
| 308 |
</div>
|
| 309 |
</div>
|
|
@@ -312,7 +312,7 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 312 |
<div class="card bg-ghost-card h-100">
|
| 313 |
<div class="card-body">
|
| 314 |
<h4>Summon Spirits</h4>
|
| 315 |
-
<p class="lead-text">
|
| 316 |
</div>
|
| 317 |
</div>
|
| 318 |
</div>
|
|
@@ -320,7 +320,7 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 320 |
<div class="card bg-ghost-card h-100">
|
| 321 |
<div class="card-body">
|
| 322 |
<h4>Export Results</h4>
|
| 323 |
-
<p class="lead-text">
|
| 324 |
</div>
|
| 325 |
</div>
|
| 326 |
</div>
|
|
@@ -332,13 +332,13 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 332 |
<section id="community" class="py-5 bg-ghost-alt text-dark">
|
| 333 |
<div class="container">
|
| 334 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🤝 Community Hub</h2>
|
| 335 |
-
<p class="lead light-lead-text mb-4">
|
| 336 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 337 |
<div class="col">
|
| 338 |
<div class="card bg-ghost-alt-card h-100">
|
| 339 |
<div class="card-body text-center">
|
| 340 |
<h3 class="card-title">💬 Discord Server</h3>
|
| 341 |
-
<p class="light-lead-text">
|
| 342 |
<a href="https://discord.gg/ghostpack" class="btn btn-ghost" target="_blank">Join Now</a>
|
| 343 |
</div>
|
| 344 |
</div>
|
|
@@ -347,7 +347,7 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 347 |
<div class="card bg-ghost-alt-card h-100">
|
| 348 |
<div class="card-body text-center">
|
| 349 |
<h3 class="card-title">🐦 X Thread</h3>
|
| 350 |
-
<p class="light-lead-text">
|
| 351 |
<a href="https://x.com/search?q=ghostpack" class="btn btn-ghost" target="_blank">Visit X</a>
|
| 352 |
</div>
|
| 353 |
</div>
|
|
@@ -363,13 +363,13 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 363 |
<section id="technical" class="py-5 bg-dark text-white">
|
| 364 |
<div class="container">
|
| 365 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🔍 Technical Deep Dive</h2>
|
| 366 |
-
<p class="lead lead-text mb-4">
|
| 367 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 368 |
<div class="col">
|
| 369 |
<div class="card bg-ghost-card h-100">
|
| 370 |
<div class="card-body text-center">
|
| 371 |
<h3 class="card-title">🛠️ Architecture</h3>
|
| 372 |
-
<p class="lead-text">Built on HunyuanVideo and FramePackI2V_HY,
|
| 373 |
</div>
|
| 374 |
</div>
|
| 375 |
</div>
|
|
@@ -377,13 +377,13 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 377 |
<div class="card bg-ghost-card h-100">
|
| 378 |
<div class="card-body text-center">
|
| 379 |
<h3 class="card-title">📊 Pipeline</h3>
|
| 380 |
-
<p class="lead-text">
|
| 381 |
</div>
|
| 382 |
</div>
|
| 383 |
</div>
|
| 384 |
</div>
|
| 385 |
<div class="text-center mt-4">
|
| 386 |
-
<a href="https://github.com/ghostai1/GhostPack/wiki" class="btn btn-ghost" target="_blank">Wiki 🔗</a>
|
| 387 |
</div>
|
| 388 |
</div>
|
| 389 |
</section>
|
|
@@ -394,16 +394,16 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 394 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">❓ Frequently Asked Questions</h2>
|
| 395 |
<div class="accordion" id="faqAccordion">
|
| 396 |
<div class="accordion-item bg-ghost-alt-card">
|
| 397 |
-
<h2 class="accordion-header"><button class="accordion-button" data-bs-toggle="collapse" data-bs-target="#faq1">What hardware is
|
| 398 |
-
<div id="faq1" class="accordion-collapse collapse show"><div class="accordion-body light-lead-text">Minimum: 6GB VRAM GPU (e.g., GTX 1650)
|
| 399 |
</div>
|
| 400 |
<div class="accordion-item bg-ghost-alt-card">
|
| 401 |
<h2 class="accordion-header"><button class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#faq2">How do I install GhostPack?</button></h2>
|
| 402 |
-
<div id="faq2" class="accordion-collapse collapse"><div class="accordion-body light-lead-text">Clone the
|
| 403 |
</div>
|
| 404 |
<div class="accordion-item bg-ghost-alt-card">
|
| 405 |
-
<h2 class="accordion-header"><button class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#faq3">Can I contribute
|
| 406 |
-
<div id="faq3" class="accordion-collapse collapse"><div class="accordion-body light-lead-text">
|
| 407 |
</div>
|
| 408 |
</div>
|
| 409 |
</div>
|
|
@@ -413,14 +413,14 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 413 |
<section id="tutorials" class="py-5 bg-dark text-white">
|
| 414 |
<div class="container">
|
| 415 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">📚 Tutorials</h2>
|
| 416 |
-
<p class="lead lead-text mb-4">
|
| 417 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 418 |
<div class="col">
|
| 419 |
<div class="card bg-ghost-card h-100">
|
| 420 |
<div class="card-body text-center">
|
| 421 |
<h3 class="card-title">🎬 Getting Started</h3>
|
| 422 |
-
<p class="lead-text">
|
| 423 |
-
<a href="https://github.com/ghostai1/GhostPack/wiki/Getting-Started" class="btn btn-ghost" target="_blank">
|
| 424 |
</div>
|
| 425 |
</div>
|
| 426 |
</div>
|
|
@@ -428,8 +428,8 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 428 |
<div class="card bg-ghost-card h-100">
|
| 429 |
<div class="card-body text-center">
|
| 430 |
<h3 class="card-title">⚙️ Advanced Configuration</h3>
|
| 431 |
-
<p class="lead-text">
|
| 432 |
-
<a href="https://github.com/ghostai1/GhostPack/wiki/Advanced-Configuration" class="btn btn-ghost" target="_blank">
|
| 433 |
</div>
|
| 434 |
</div>
|
| 435 |
</div>
|
|
@@ -437,8 +437,8 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 437 |
<div class="card bg-ghost-card h-100">
|
| 438 |
<div class="card-body text-center">
|
| 439 |
<h3 class="card-title">🎥 Video Export Tips</h3>
|
| 440 |
-
<p class="lead-text">Expert
|
| 441 |
-
<a href="https://github.com/ghostai1/GhostPack/wiki/Video-Export-Tips" class="btn btn-ghost" target="_blank">
|
| 442 |
</div>
|
| 443 |
</div>
|
| 444 |
</div>
|
|
@@ -453,17 +453,17 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 453 |
<section id="contribute" class="py-5 bg-ghost-alt text-dark">
|
| 454 |
<div class="container">
|
| 455 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🌱 Contributing Guidelines</h2>
|
| 456 |
-
<p class="lead light-lead-text mb-4">
|
| 457 |
<div class="row">
|
| 458 |
<div class="col-md-12">
|
| 459 |
<div class="card bg-ghost-alt-card">
|
| 460 |
<div class="card-body text-center">
|
| 461 |
<h3 class="card-title">🎯 How to Contribute</h3>
|
| 462 |
<ul class="light-lead-text">
|
| 463 |
-
<li>Fork the repository and create a feature branch.</li>
|
| 464 |
-
<li>Submit pull requests with
|
| 465 |
-
<li>
|
| 466 |
-
<li>
|
| 467 |
</ul>
|
| 468 |
<a href="https://github.com/ghostai1/GhostPack/blob/main/CONTRIBUTING.md" class="btn btn-ghost" target="_blank">View Guidelines</a>
|
| 469 |
</div>
|
|
@@ -477,34 +477,34 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 477 |
<section id="screenshots" class="py-5 bg-dark text-white">
|
| 478 |
<div class="container">
|
| 479 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">📸 Screenshots</h2>
|
| 480 |
-
<p class="lead lead-text mb-4">
|
| 481 |
<div class="row row-cols-1 row-cols-md-3 g-4">
|
| 482 |
<div class="col">
|
| 483 |
<div class="card bg-ghost-card h-100">
|
| 484 |
<div class="card-body text-center">
|
| 485 |
-
<img src="https://cdn-uploads.huggingface.co/production/uploads/6421b1c68adc8881b974a89d/7ABE2lOA4LOUtPfh1mhxP.png" alt="Main Interface" class="img-fluid rounded" style="max-height: 300px;">
|
| 486 |
-
<p class="mt-2">Main Interface</p>
|
| 487 |
</div>
|
| 488 |
</div>
|
| 489 |
</div>
|
| 490 |
<div class="col">
|
| 491 |
<div class="card bg-ghost-card h-100">
|
| 492 |
<div class="card-body text-center">
|
| 493 |
-
<img src="https://cdn-uploads.huggingface.co/production/uploads/6421b1c68adc8881b974a89d/9qNVRX2eM2iCY8xQKcOwW.png" alt="Advanced Settings" class="img-fluid rounded" style="max-height: 300px;">
|
| 494 |
-
<p class="mt-2">Advanced Settings</p>
|
| 495 |
</div>
|
| 496 |
</div>
|
| 497 |
</div>
|
| 498 |
<div class="col">
|
| 499 |
<div class="card bg-ghost-card h-100">
|
| 500 |
<div class="card-body text-center">
|
| 501 |
-
<img src="https://cdn-uploads.huggingface.co/production/uploads/6421b1c68adc8881b974a89d/--fIS9ITg4-VqN22ySoa2.png" alt="Logs Display" class="img-fluid rounded" style="max-height: 300px;">
|
| 502 |
-
<p class="mt-2">Logs Display</p>
|
| 503 |
</div>
|
| 504 |
</div>
|
| 505 |
</div>
|
| 506 |
</div>
|
| 507 |
-
<p class="text-center mt-4 lead-text">
|
| 508 |
</div>
|
| 509 |
</section>
|
| 510 |
|
|
@@ -512,13 +512,13 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 512 |
<section id="files" class="py-5 bg-ghost-alt text-dark">
|
| 513 |
<div class="container">
|
| 514 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">📂 Latest Conjurations</h2>
|
| 515 |
-
<p class="lead light-lead-text mb-4">
|
| 516 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 517 |
<div class="col">
|
| 518 |
<div class="card bg-ghost-alt-card h-100">
|
| 519 |
<div class="card-body text-center">
|
| 520 |
<h3 class="card-title">📜 Latest File</h3>
|
| 521 |
-
<p class="light-lead-text">
|
| 522 |
<a href="https://github.com/ghostai1/GhostPack/blob/main/ghostgradio.py" class="btn btn-ghost" target="_blank">View File</a>
|
| 523 |
</div>
|
| 524 |
</div>
|
|
@@ -527,7 +527,7 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 527 |
<div class="card bg-ghost-alt-card h-100">
|
| 528 |
<div class="card-body text-center">
|
| 529 |
<h3 class="card-title">📋 Logs</h3>
|
| 530 |
-
<p class="light-lead-text">
|
| 531 |
<a href="https://github.com/ghostai1/GhostPack/tree/main/outputs" class="btn btn-ghost" target="_blank">View Logs</a>
|
| 532 |
</div>
|
| 533 |
</div>
|
|
@@ -543,39 +543,39 @@ python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
|
| 543 |
<!-- Footer -->
|
| 544 |
<footer class="bg-ghost-black text-white text-center py-3">
|
| 545 |
<p>👻 GhostPack by ghostai1 | <a href="https://github.com/ghostai1/GhostPack">GitHub</a> | <a href="https://huggingface.co/spaces/ghostai1/GhostPack">Hugging Face</a> | Apache-2.0</p>
|
| 546 |
-
<p>Created 07:
|
| 547 |
</footer>
|
| 548 |
|
| 549 |
<!-- Modals -->
|
| 550 |
<div class="modal fade" id="teacacheModal" tabindex="-1" aria-labelledby="teacacheModalLabel" aria-hidden="true">
|
| 551 |
-
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="teacacheModalLabel">🔮 Teacache</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>
|
| 552 |
</div>
|
| 553 |
<div class="modal fade" id="contextModal" tabindex="-1" aria-labelledby="contextModalLabel" aria-hidden="true">
|
| 554 |
-
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="contextModalLabel">🧬 Context Packing</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>
|
| 555 |
</div>
|
| 556 |
<div class="modal fade" id="batchingModal" tabindex="-1" aria-labelledby="batchingModalLabel" aria-hidden="true">
|
| 557 |
-
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="batchingModalLabel">⚡ Dynamic Batching</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>
|
| 558 |
</div>
|
| 559 |
<div class="modal fade" id="sageModal" tabindex="-1" aria-labelledby="sageModalLabel" aria-hidden="true">
|
| 560 |
-
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="sageModalLabel">🧙♂️ Sage-Attention</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>
|
| 561 |
</div>
|
| 562 |
<div class="modal fade" id="tcmallocModal" tabindex="-1" aria-labelledby="tcmallocModalLabel" aria-hidden="true">
|
| 563 |
-
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="tcmallocModalLabel">💾 tcmalloc</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>
|
| 564 |
</div>
|
| 565 |
<div class="modal fade" id="cudaModal" tabindex="-1" aria-labelledby="cudaModalLabel" aria-hidden="true">
|
| 566 |
-
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="cudaModalLabel">⚡ CUDA Tweaks</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>
|
| 567 |
</div>
|
| 568 |
<div class="modal fade" id="dynamicModal" tabindex="-1" aria-labelledby="dynamicModalLabel" aria-hidden="true">
|
| 569 |
-
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="dynamicModalLabel">🚀 Dynamic Scheduling</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>
|
| 570 |
</div>
|
| 571 |
<div class="modal fade" id="cacheModal" tabindex="-1" aria-labelledby="cacheModalLabel" aria-hidden="true">
|
| 572 |
-
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="cacheModalLabel">📦 Memory Cache</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>
|
| 573 |
</div>
|
| 574 |
<div class="modal fade" id="powerModal" tabindex="-1" aria-labelledby="powerModalLabel" aria-hidden="true">
|
| 575 |
-
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="powerModalLabel">🔋 Power Optimization</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>
|
| 576 |
</div>
|
| 577 |
<div class="modal fade" id="threadModal" tabindex="-1" aria-labelledby="threadModalLabel" aria-hidden="true">
|
| 578 |
-
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="threadModalLabel">🧵 Thread Tuning</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>
|
| 579 |
</div>
|
| 580 |
|
| 581 |
<!-- Bootstrap JS -->
|
|
|
|
| 28 |
<li class="nav-item"><a class="nav-link" href="#optimizations">Math Sorcery</a></li>
|
| 29 |
<li class="nav-item"><a class="nav-link" href="#demo">Demo</a></li>
|
| 30 |
<li class="nav-item"><a class="nav-link" href="#future">Future</a></li>
|
| 31 |
+
<li class="nav-item"><a class="nav-link" href="#installation">Install</a></li>
|
| 32 |
<li class="nav-item"><a class="nav-link" href="#usage">Usage</a></li>
|
| 33 |
<li class="nav-item"><a class="nav-link" href="#community">Community</a></li>
|
| 34 |
+
<li class="nav-item"><a class="nav-link" href="#technical">Tech Dive</a></li>
|
| 35 |
<li class="nav-item"><a class="nav-link" href="#faq">FAQ</a></li>
|
| 36 |
<li class="nav-item"><a class="nav-link" href="#tutorials">Tutorials</a></li>
|
| 37 |
<li class="nav-item"><a class="nav-link" href="#contribute">Contribute</a></li>
|
| 38 |
+
<li class="nav-item"><a class="nav-link" href="#files">Files</a></li>
|
| 39 |
<li class="nav-item"><a class="nav-link" href="#screenshots">Screenshots</a></li>
|
| 40 |
</ul>
|
| 41 |
</div>
|
|
|
|
| 46 |
<section id="home" class="hero-section text-center text-white">
|
| 47 |
<div class="container py-5">
|
| 48 |
<h1 class="display-3 animate__animated animate__zoomIn">👻 GhostPack</h1>
|
| 49 |
+
<p class="lead animate__animated animate__fadeIn animate__delay-1s">Veo 3-Level Video Sorcery for Laptops! 😈🚀</p>
|
| 50 |
+
<p class="animate__animated animate__fadeIn animate__delay-2s">Unleash stunning videos with ghostai1’s math on ≥6GB VRAM GPUs.</p>
|
| 51 |
<div class="preview-window animate__animated animate__fadeIn animate__delay-3s">
|
| 52 |
+
<img src="https://huggingface.co/spaces/ghostai1/GhostPack/resolve/main/preview_mockup.png" alt="GhostPack Preview" class="img-fluid rounded shadow-lg">
|
| 53 |
+
<p class="mt-2 text-muted">Preview of ghostgradio.py interface and video generation.</p>
|
| 54 |
</div>
|
| 55 |
<div class="mt-4">
|
| 56 |
+
<a href="#installation" class="btn btn-ghost btn-lg animate__animated animate__pulse animate__delay-4s me-3">Get Started 🛠️</a>
|
| 57 |
<a href="https://github.com/ghostai1/GhostPack" class="btn btn-outline-ghost btn-lg animate__animated animate__pulse animate__delay-4s" target="_blank">GitHub 🌟</a>
|
| 58 |
</div>
|
| 59 |
</div>
|
|
|
|
| 63 |
<section id="features" class="py-5 bg-dark text-white">
|
| 64 |
<div class="container">
|
| 65 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">✨ Spectral Features</h2>
|
| 66 |
+
<p class="lead lead-text mb-4">Explore GhostPack’s powerful video generation tools.</p>
|
| 67 |
<div class="row row-cols-1 row-cols-md-3 g-4">
|
| 68 |
<div class="col">
|
| 69 |
<div class="card bg-ghost-card h-100">
|
| 70 |
<div class="card-body text-center">
|
| 71 |
<h3 class="card-title">📹 Veo 3-Level AI</h3>
|
| 72 |
+
<p class="card-text">Creates hyper-realistic videos with advanced next-frame prediction, optimized for 8GB RAM laptops with seamless transitions.</p>
|
| 73 |
</div>
|
| 74 |
</div>
|
| 75 |
</div>
|
|
|
|
| 77 |
<div class="card bg-ghost-card h-100">
|
| 78 |
<div class="card-body text-center">
|
| 79 |
<h3 class="card-title">⚡️ Phantom Speed</h3>
|
| 80 |
+
<p class="card-text">Teacache boosts speed by ~40%, reducing frame time to ~12-15s on RTX 3060 for rapid rendering.</p>
|
| 81 |
</div>
|
| 82 |
</div>
|
| 83 |
</div>
|
|
|
|
| 85 |
<div class="card bg-ghost-card h-100">
|
| 86 |
<div class="card-body text-center">
|
| 87 |
<h3 class="card-title">🛠️ Laptop Domination</h3>
|
| 88 |
+
<p class="card-text">Supports 13B models on ≥6GB VRAM GPUs, perfect for budget setups like RTX 3060.</p>
|
| 89 |
</div>
|
| 90 |
</div>
|
| 91 |
</div>
|
|
|
|
| 93 |
<div class="card bg-ghost-card h-100">
|
| 94 |
<div class="card-body text-center">
|
| 95 |
<h3 class="card-title">🎛️ Custom Workflows</h3>
|
| 96 |
+
<p class="card-text">Customize frame length, batch size, and prompts to suit any creative vision.</p>
|
| 97 |
</div>
|
| 98 |
</div>
|
| 99 |
</div>
|
|
|
|
| 101 |
<div class="card bg-ghost-card h-100">
|
| 102 |
<div class="card-body text-center">
|
| 103 |
<h3 class="card-title">👁️ Live Preview</h3>
|
| 104 |
+
<p class="card-text">Real-time frame previews in ghostgradio.py for instant creative control.</p>
|
| 105 |
</div>
|
| 106 |
</div>
|
| 107 |
</div>
|
|
|
|
| 109 |
<div class="card bg-ghost-card h-100">
|
| 110 |
<div class="card-body text-center">
|
| 111 |
<h3 class="card-title">🤝 Open Source</h3>
|
| 112 |
+
<p class="card-text">Powered by community contributions and open-source code for continuous improvement.</p>
|
| 113 |
</div>
|
| 114 |
</div>
|
| 115 |
</div>
|
|
|
|
| 121 |
<section id="optimizations" class="py-5 bg-dark text-white">
|
| 122 |
<div class="container">
|
| 123 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🧙♂️ Ghostai1’s Math Sorcery</h2>
|
| 124 |
+
<p class="lead lead-text mb-4">Advanced optimizations for low-resource systems.</p>
|
| 125 |
<ul class="nav nav-tabs justify-content-center mb-4" id="optTab" role="tablist">
|
| 126 |
<li class="nav-item"><button class="nav-link active" id="speed-tab" data-bs-toggle="tab" data-bs-target="#speed" type="button">⚡️ Speed</button></li>
|
| 127 |
<li class="nav-item"><button class="nav-link" id="memory-tab" data-bs-toggle="tab" data-bs-target="#memory" type="button">🔮 Memory</button></li>
|
|
|
|
| 131 |
<div class="tab-content" id="optTabContent">
|
| 132 |
<div class="tab-pane fade show active" id="speed" role="tabpanel">
|
| 133 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 134 |
+
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🔮 Teacache</h4><p class="lead-text">Boosts speed by ~40% (~12s/frame on RTX 3060), \( T_{\text{total}} \approx 0.6 \cdot T_{\text{base}} \)</p></div></div></div>
|
| 135 |
+
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🧙♂️ Sage-Attention</h4><p class="lead-text">Enhances speed by ~5-10%, \( T_{\text{attn}} \approx 0.9 \cdot T_{\text{base_attn}} \)</p></div></div></div>
|
| 136 |
+
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>⚡ CUDA Tweaks</h4><p class="lead-text">Reduces latency by ~10-15%, \( L_{\text{CUDA}} \approx 0.85 \cdot L_{\text{base}} \)</p></div></div></div>
|
| 137 |
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🚀 Dynamic Scheduling</h4><p class="lead-text">Speeds tasks by ~15-20%, \( T_{\text{sched}} \approx 0.8 \cdot T_{\text{base_sched}} \)</p></div></div></div>
|
| 138 |
</div>
|
| 139 |
</div>
|
| 140 |
<div class="tab-pane fade" id="memory" role="tabpanel">
|
| 141 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 142 |
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🧬 Context Packing</h4><p class="lead-text">Saves ~50% VRAM (~2-3GB), \( M_{\text{VRAM}} \propto O(1) \)</p></div></div></div>
|
| 143 |
+
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>💾 tcmalloc</h4><p class="lead-text">Cuts overhead by ~5-20%, \( O_{\text{mem}} \approx 0.8 \cdot O_{\text{glibc}} \)</p></div></div></div>
|
| 144 |
+
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>📦 Memory Cache</h4><p class="lead-text">Reduces swaps by ~25%, \( M_{\text{swap}} \approx 0.75 \cdot M_{\text{base_swap}} \)</p></div></div></div>
|
| 145 |
</div>
|
| 146 |
</div>
|
| 147 |
<div class="tab-pane fade" id="compute" role="tabpanel">
|
| 148 |
<div class="row row-cols-1 g-4">
|
| 149 |
+
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>⚡ Dynamic Batching</h4><p class="lead-text">Increases throughput by ~30-50%, \( \text{Throughput} \propto B \cdot \text{FPS}_{\text{base}} \)</p></div></div></div>
|
| 150 |
</div>
|
| 151 |
</div>
|
| 152 |
<div class="tab-pane fade" id="efficiency" role="tabpanel">
|
| 153 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 154 |
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🔋 Power Optimization</h4><p class="lead-text">Saves ~20-30% power, \( P_{\text{idle}} \approx 0.7 \cdot P_{\text{base_idle}} \)</p></div></div></div>
|
| 155 |
+
<div class="col"><div class="card bg-ghost-card"><div class="card-body"><h4>🧵 Thread Tuning</h4><p class="lead-text">Boosts CPU by ~10-15%, \( C_{\text{thread}} \approx 0.85 \cdot C_{\text{base_thread}} \)</p></div></div></div>
|
| 156 |
</div>
|
| 157 |
</div>
|
| 158 |
</div>
|
| 159 |
<div class="row mt-5">
|
| 160 |
+
<div class="col-12">
|
| 161 |
<h3 class="text-center text-white mb-3">VRAM Requirements 🖥️</h3>
|
| 162 |
<div class="table-responsive">
|
| 163 |
<table class="table table-dark table-bordered">
|
|
|
|
| 179 |
<section id="demo" class="py-5 bg-dark text-white">
|
| 180 |
<div class="container">
|
| 181 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🎥 Demo Video Showcase</h2>
|
| 182 |
+
<p class="lead lead-text mb-4 animate__animated animate__fadeIn">Experience GhostPack’s spectral video generation live!</p>
|
| 183 |
+
<div class="row justify-content-center">
|
| 184 |
+
<div class="col-md-8">
|
| 185 |
<div class="card bg-ghost-card animate__animated animate__fadeIn">
|
| 186 |
+
<div class="card-body text-center p-4">
|
| 187 |
+
<img src="https://cdn-uploads.huggingface.co/production/uploads/6421b1c68adc8881b974a89d/k8pgUlg4OvdUZpbMNTcp5.gif" alt="GhostPack Demo GIF" class="img-fluid rounded" style="max-height: 400px; border: 2px solid #00ffcc;">
|
| 188 |
+
<p class="mt-3">Sample output from ghostgradio.py, showcasing a dynamic neon-lit spectral battle.</p>
|
| 189 |
</div>
|
| 190 |
</div>
|
| 191 |
</div>
|
| 192 |
</div>
|
| 193 |
<div class="text-center mt-4">
|
| 194 |
+
<a href="https://github.com/ghostai1/GhostPack/blob/main/demo_videos" class="btn btn-ghost" target="_blank">Explore More Demos 📹</a>
|
| 195 |
</div>
|
| 196 |
</div>
|
| 197 |
</section>
|
|
|
|
| 200 |
<section id="future" class="py-5 bg-ghost-alt text-dark">
|
| 201 |
<div class="container">
|
| 202 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🌌 Future Spectral Phantoms</h2>
|
| 203 |
+
<p class="lead light-lead-text mb-4">Innovative upgrades to redefine AI video creation.</p>
|
| 204 |
<div class="row row-cols-1 row-cols-md-3 g-4">
|
| 205 |
<div class="col">
|
| 206 |
<div class="card bg-ghost-alt-card h-100">
|
| 207 |
<div class="card-body text-center">
|
| 208 |
<h3 class="card-title">🗣️ Voice Generation</h3>
|
| 209 |
+
<p class="light-lead-text">AI-powered voice synthesis with customizable tones, integrating seamlessly into ghostgradio.py for narrated videos.</p>
|
| 210 |
</div>
|
| 211 |
</div>
|
| 212 |
</div>
|
|
|
|
| 214 |
<div class="card bg-ghost-alt-card h-100">
|
| 215 |
<div class="card-body text-center">
|
| 216 |
<h3 class="card-title">🖼️ AI Images</h3>
|
| 217 |
+
<p class="light-lead-text">Generates high-quality starting frames with AI-crafted visuals, enhancing video pipeline creativity.</p>
|
| 218 |
</div>
|
| 219 |
</div>
|
| 220 |
</div>
|
|
|
|
| 222 |
<div class="card bg-ghost-alt-card h-100">
|
| 223 |
<div class="card-body text-center">
|
| 224 |
<h3 class="card-title">🎮 VR Integration</h3>
|
| 225 |
+
<p class="light-lead-text">Upcoming VR video rendering support for immersive, 3D spectral experiences.</p>
|
| 226 |
</div>
|
| 227 |
</div>
|
| 228 |
</div>
|
|
|
|
| 234 |
<section id="installation" class="py-5 bg-dark text-white">
|
| 235 |
<div class="container">
|
| 236 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🛠️ Unleash GhostPack</h2>
|
| 237 |
+
<p class="lead lead-text mb-4">Get started with GitHub, requires >30GB disk and compatible hardware.</p>
|
| 238 |
<div class="row row-cols-1 row-cols-md-3 g-4">
|
| 239 |
<div class="col">
|
| 240 |
<div class="card bg-ghost-card h-100">
|
|
|
|
| 244 |
cd GhostPack
|
| 245 |
chmod +x install_ubuntu.sh
|
| 246 |
./install_ubuntu.sh</code></pre>
|
| 247 |
+
<p>Requires NVIDIA GPU, 8GB RAM, Python 3.10, and CUDA 12.6.</p>
|
| 248 |
</div>
|
| 249 |
</div>
|
| 250 |
</div>
|
|
|
|
| 255 |
<pre><code class="code-block">git clone https://github.com/ghostai1/GhostPack
|
| 256 |
cd GhostPack
|
| 257 |
install.bat</code></pre>
|
| 258 |
+
<p>Auto-downloads >30GB models, requires NVIDIA drivers.</p>
|
| 259 |
</div>
|
| 260 |
</div>
|
| 261 |
</div>
|
|
|
|
| 267 |
cd GhostPack
|
| 268 |
chmod +x install_macos.sh
|
| 269 |
./install_macos.sh</code></pre>
|
| 270 |
+
<p>Supports M1/M2 (slower), requires Metal compatibility.</p>
|
| 271 |
</div>
|
| 272 |
</div>
|
| 273 |
</div>
|
|
|
|
| 282 |
<section id="usage" class="py-5 bg-dark text-white">
|
| 283 |
<div class="container">
|
| 284 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">📹 Weave Ghostly Videos</h2>
|
| 285 |
+
<p class="lead lead-text mb-4">Step-by-step guide to mastering GhostPack’s video sorcery.</p>
|
| 286 |
<div class="row row-cols-1 g-4">
|
| 287 |
<div class="col">
|
| 288 |
<div class="card bg-ghost-card h-100">
|
|
|
|
| 291 |
<pre><code class="code-block">source ~/ghostpack_venv/venv/bin/activate
|
| 292 |
cd ~/ghostpack_venv
|
| 293 |
python ghostgradio.py --port 5666 --server 0.0.0.0</code></pre>
|
| 294 |
+
<p>Activates the virtual environment and starts the GUI on port 5666.</p>
|
| 295 |
</div>
|
| 296 |
</div>
|
| 297 |
</div>
|
|
|
|
| 300 |
<div class="card-body">
|
| 301 |
<h4>Craft Spells</h4>
|
| 302 |
<ul class="lead-text">
|
| 303 |
+
<li>Upload an initial image or video frame to begin.</li>
|
| 304 |
+
<li>Input prompt: “A spectral figure glides through a neon-lit city.”</li>
|
| 305 |
+
<li>Enable teacache for ⚡️ speed and tweak batch size for performance.</li>
|
| 306 |
+
<li>Configure 15fps, 5s video (~75 frames) or adjust duration and frame rate.</li>
|
| 307 |
</ul>
|
| 308 |
</div>
|
| 309 |
</div>
|
|
|
|
| 312 |
<div class="card bg-ghost-card h-100">
|
| 313 |
<div class="card-body">
|
| 314 |
<h4>Summon Spirits</h4>
|
| 315 |
+
<p class="lead-text">Track GPU usage with <code>nvidia-smi</code>, expecting ~80-100% during rendering.</p>
|
| 316 |
</div>
|
| 317 |
</div>
|
| 318 |
</div>
|
|
|
|
| 320 |
<div class="card bg-ghost-card h-100">
|
| 321 |
<div class="card-body">
|
| 322 |
<h4>Export Results</h4>
|
| 323 |
+
<p class="lead-text">Export MP4 files with adjustable compression (CRF 0-100) for quality balance.</p>
|
| 324 |
</div>
|
| 325 |
</div>
|
| 326 |
</div>
|
|
|
|
| 332 |
<section id="community" class="py-5 bg-ghost-alt text-dark">
|
| 333 |
<div class="container">
|
| 334 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🤝 Community Hub</h2>
|
| 335 |
+
<p class="lead light-lead-text mb-4">Join the GhostPack community to collaborate and grow.</p>
|
| 336 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 337 |
<div class="col">
|
| 338 |
<div class="card bg-ghost-alt-card h-100">
|
| 339 |
<div class="card-body text-center">
|
| 340 |
<h3 class="card-title">💬 Discord Server</h3>
|
| 341 |
+
<p class="light-lead-text">Engage in real-time with creators for support, updates, and discussions.</p>
|
| 342 |
<a href="https://discord.gg/ghostpack" class="btn btn-ghost" target="_blank">Join Now</a>
|
| 343 |
</div>
|
| 344 |
</div>
|
|
|
|
| 347 |
<div class="card bg-ghost-alt-card h-100">
|
| 348 |
<div class="card-body text-center">
|
| 349 |
<h3 class="card-title">🐦 X Thread</h3>
|
| 350 |
+
<p class="light-lead-text">Stay updated with news, in-depth tutorials, and community highlights.</p>
|
| 351 |
<a href="https://x.com/search?q=ghostpack" class="btn btn-ghost" target="_blank">Visit X</a>
|
| 352 |
</div>
|
| 353 |
</div>
|
|
|
|
| 363 |
<section id="technical" class="py-5 bg-dark text-white">
|
| 364 |
<div class="container">
|
| 365 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🔍 Technical Deep Dive</h2>
|
| 366 |
+
<p class="lead lead-text mb-4">Uncover the technical backbone of GhostPack’s engine.</p>
|
| 367 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 368 |
<div class="col">
|
| 369 |
<div class="card bg-ghost-card h-100">
|
| 370 |
<div class="card-body text-center">
|
| 371 |
<h3 class="card-title">🛠️ Architecture</h3>
|
| 372 |
+
<p class="lead-text">Built on HunyuanVideo and FramePackI2V_HY, leveraging LlamaModel and CLIPTextModel for advanced embeddings and processing power.</p>
|
| 373 |
</div>
|
| 374 |
</div>
|
| 375 |
</div>
|
|
|
|
| 377 |
<div class="card bg-ghost-card h-100">
|
| 378 |
<div class="card-body text-center">
|
| 379 |
<h3 class="card-title">📊 Pipeline</h3>
|
| 380 |
+
<p class="lead-text">Utilizes k-diffusion sampling with unipc, optimized for real-time preview and high-quality frame generation.</p>
|
| 381 |
</div>
|
| 382 |
</div>
|
| 383 |
</div>
|
| 384 |
</div>
|
| 385 |
<div class="text-center mt-4">
|
| 386 |
+
<a href="https://github.com/ghostai1/GhostPack/wiki" class="btn btn-ghost" target="_blank">Explore Wiki 🔗</a>
|
| 387 |
</div>
|
| 388 |
</div>
|
| 389 |
</section>
|
|
|
|
| 394 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">❓ Frequently Asked Questions</h2>
|
| 395 |
<div class="accordion" id="faqAccordion">
|
| 396 |
<div class="accordion-item bg-ghost-alt-card">
|
| 397 |
+
<h2 class="accordion-header"><button class="accordion-button" data-bs-toggle="collapse" data-bs-target="#faq1">What hardware is needed?</button></h2>
|
| 398 |
+
<div id="faq1" class="accordion-collapse collapse show"><div class="accordion-body light-lead-text">Minimum: 6GB VRAM GPU (e.g., GTX 1650) and 8GB RAM; Optimal: 12GB VRAM (e.g., RTX 3060).</div></div>
|
| 399 |
</div>
|
| 400 |
<div class="accordion-item bg-ghost-alt-card">
|
| 401 |
<h2 class="accordion-header"><button class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#faq2">How do I install GhostPack?</button></h2>
|
| 402 |
+
<div id="faq2" class="accordion-collapse collapse"><div class="accordion-body light-lead-text">Clone the repo and execute the relevant install script, e.g., <code>./install_ubuntu.sh</code>, from the Installation section.</div></div>
|
| 403 |
</div>
|
| 404 |
<div class="accordion-item bg-ghost-alt-card">
|
| 405 |
+
<h2 class="accordion-header"><button class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#faq3">Can I contribute?</button></h2>
|
| 406 |
+
<div id="faq3" class="accordion-collapse collapse"><div class="accordion-body light-lead-text">Absolutely, review the Contributing Guidelines for participation details.</div></div>
|
| 407 |
</div>
|
| 408 |
</div>
|
| 409 |
</div>
|
|
|
|
| 413 |
<section id="tutorials" class="py-5 bg-dark text-white">
|
| 414 |
<div class="container">
|
| 415 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">📚 Tutorials</h2>
|
| 416 |
+
<p class="lead lead-text mb-4">In-depth guides to master GhostPack’s video sorcery.</p>
|
| 417 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 418 |
<div class="col">
|
| 419 |
<div class="card bg-ghost-card h-100">
|
| 420 |
<div class="card-body text-center">
|
| 421 |
<h3 class="card-title">🎬 Getting Started</h3>
|
| 422 |
+
<p class="lead-text">Comprehensive setup guide and first video creation with GhostPack.</p>
|
| 423 |
+
<a href="https://github.com/ghostai1/GhostPack/wiki/Getting-Started" class="btn btn-ghost" target="_blank">Start Here</a>
|
| 424 |
</div>
|
| 425 |
</div>
|
| 426 |
</div>
|
|
|
|
| 428 |
<div class="card bg-ghost-card h-100">
|
| 429 |
<div class="card-body text-center">
|
| 430 |
<h3 class="card-title">⚙️ Advanced Configuration</h3>
|
| 431 |
+
<p class="lead-text">Learn to fine-tune prompts, batch sizes, and advanced settings for pro results.</p>
|
| 432 |
+
<a href="https://github.com/ghostai1/GhostPack/wiki/Advanced-Configuration" class="btn btn-ghost" target="_blank">Go Advanced</a>
|
| 433 |
</div>
|
| 434 |
</div>
|
| 435 |
</div>
|
|
|
|
| 437 |
<div class="card bg-ghost-card h-100">
|
| 438 |
<div class="card-body text-center">
|
| 439 |
<h3 class="card-title">🎥 Video Export Tips</h3>
|
| 440 |
+
<p class="lead-text">Expert advice on exporting MP4s with optimal CRF settings for quality and file size.</p>
|
| 441 |
+
<a href="https://github.com/ghostai1/GhostPack/wiki/Video-Export-Tips" class="btn btn-ghost" target="_blank">Export Guide</a>
|
| 442 |
</div>
|
| 443 |
</div>
|
| 444 |
</div>
|
|
|
|
| 453 |
<section id="contribute" class="py-5 bg-ghost-alt text-dark">
|
| 454 |
<div class="container">
|
| 455 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">🌱 Contributing Guidelines</h2>
|
| 456 |
+
<p class="lead light-lead-text mb-4">Help shape GhostPack’s future with your skills.</p>
|
| 457 |
<div class="row">
|
| 458 |
<div class="col-md-12">
|
| 459 |
<div class="card bg-ghost-alt-card">
|
| 460 |
<div class="card-body text-center">
|
| 461 |
<h3 class="card-title">🎯 How to Contribute</h3>
|
| 462 |
<ul class="light-lead-text">
|
| 463 |
+
<li>Fork the repository and create a dedicated feature branch.</li>
|
| 464 |
+
<li>Submit pull requests with detailed change descriptions.</li>
|
| 465 |
+
<li>Follow coding standards detailed in the wiki.</li>
|
| 466 |
+
<li>Thoroughly test changes with ghostgradio.py before submission.</li>
|
| 467 |
</ul>
|
| 468 |
<a href="https://github.com/ghostai1/GhostPack/blob/main/CONTRIBUTING.md" class="btn btn-ghost" target="_blank">View Guidelines</a>
|
| 469 |
</div>
|
|
|
|
| 477 |
<section id="screenshots" class="py-5 bg-dark text-white">
|
| 478 |
<div class="container">
|
| 479 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">📸 Screenshots</h2>
|
| 480 |
+
<p class="lead lead-text mb-4">Explore GhostPack’s spectral magic visually.</p>
|
| 481 |
<div class="row row-cols-1 row-cols-md-3 g-4">
|
| 482 |
<div class="col">
|
| 483 |
<div class="card bg-ghost-card h-100">
|
| 484 |
<div class="card-body text-center">
|
| 485 |
+
<img src="https://cdn-uploads.huggingface.co/production/uploads/6421b1c68adc8881b974a89d/7ABE2lOA4LOUtPfh1mhxP.png" alt="Main Interface" class="img-fluid rounded shadow-sm" style="max-height: 300px;">
|
| 486 |
+
<p class="mt-2">Main Interface Overview</p>
|
| 487 |
</div>
|
| 488 |
</div>
|
| 489 |
</div>
|
| 490 |
<div class="col">
|
| 491 |
<div class="card bg-ghost-card h-100">
|
| 492 |
<div class="card-body text-center">
|
| 493 |
+
<img src="https://cdn-uploads.huggingface.co/production/uploads/6421b1c68adc8881b974a89d/9qNVRX2eM2iCY8xQKcOwW.png" alt="Advanced Settings" class="img-fluid rounded shadow-sm" style="max-height: 300px;">
|
| 494 |
+
<p class="mt-2">Advanced Settings Panel</p>
|
| 495 |
</div>
|
| 496 |
</div>
|
| 497 |
</div>
|
| 498 |
<div class="col">
|
| 499 |
<div class="card bg-ghost-card h-100">
|
| 500 |
<div class="card-body text-center">
|
| 501 |
+
<img src="https://cdn-uploads.huggingface.co/production/uploads/6421b1c68adc8881b974a89d/--fIS9ITg4-VqN22ySoa2.png" alt="Logs Display" class="img-fluid rounded shadow-sm" style="max-height: 300px;">
|
| 502 |
+
<p class="mt-2">Logs Display View</p>
|
| 503 |
</div>
|
| 504 |
</div>
|
| 505 |
</div>
|
| 506 |
</div>
|
| 507 |
+
<p class="text-center mt-4 lead-text">Share your own screenshots to showcase your work!</p>
|
| 508 |
</div>
|
| 509 |
</section>
|
| 510 |
|
|
|
|
| 512 |
<section id="files" class="py-5 bg-ghost-alt text-dark">
|
| 513 |
<div class="container">
|
| 514 |
<h2 class="text-center mb-5 animate__animated animate__fadeIn">📂 Latest Conjurations</h2>
|
| 515 |
+
<p class="lead light-lead-text mb-4">Access the latest files and logs from the repository.</p>
|
| 516 |
<div class="row row-cols-1 row-cols-md-2 g-4">
|
| 517 |
<div class="col">
|
| 518 |
<div class="card bg-ghost-alt-card h-100">
|
| 519 |
<div class="card-body text-center">
|
| 520 |
<h3 class="card-title">📜 Latest File</h3>
|
| 521 |
+
<p class="light-lead-text">Explore <code>ghostgradio.py</code>, the heart of GhostPack’s GUI functionality.</p>
|
| 522 |
<a href="https://github.com/ghostai1/GhostPack/blob/main/ghostgradio.py" class="btn btn-ghost" target="_blank">View File</a>
|
| 523 |
</div>
|
| 524 |
</div>
|
|
|
|
| 527 |
<div class="card bg-ghost-alt-card h-100">
|
| 528 |
<div class="card-body text-center">
|
| 529 |
<h3 class="card-title">📋 Logs</h3>
|
| 530 |
+
<p class="light-lead-text">Dive into render logs for debugging and performance analysis.</p>
|
| 531 |
<a href="https://github.com/ghostai1/GhostPack/tree/main/outputs" class="btn btn-ghost" target="_blank">View Logs</a>
|
| 532 |
</div>
|
| 533 |
</div>
|
|
|
|
| 543 |
<!-- Footer -->
|
| 544 |
<footer class="bg-ghost-black text-white text-center py-3">
|
| 545 |
<p>👻 GhostPack by ghostai1 | <a href="https://github.com/ghostai1/GhostPack">GitHub</a> | <a href="https://huggingface.co/spaces/ghostai1/GhostPack">Hugging Face</a> | Apache-2.0</p>
|
| 546 |
+
<p>Created 07:20 PM CDT, June 11, 2025 😈⚡️</p>
|
| 547 |
</footer>
|
| 548 |
|
| 549 |
<!-- Modals -->
|
| 550 |
<div class="modal fade" id="teacacheModal" tabindex="-1" aria-labelledby="teacacheModalLabel" aria-hidden="true">
|
| 551 |
+
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="teacacheModalLabel">🔮 Teacache</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>Enhances performance by caching diffusion states, reducing frame time by ~40% (~12s/frame on RTX 3060), calculated as \( T_{\text{total}} \approx 0.6 \cdot T_{\text{base}} \).</p></div></div></div>
|
| 552 |
</div>
|
| 553 |
<div class="modal fade" id="contextModal" tabindex="-1" aria-labelledby="contextModalLabel" aria-hidden="true">
|
| 554 |
+
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="contextModalLabel">🧬 Context Packing</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>Optimizes memory by compressing contexts into a fixed matrix, saving ~50% VRAM (~2-3GB for 60s video), with \( M_{\text{VRAM}} \propto O(1) \).</p></div></div></div>
|
| 555 |
</div>
|
| 556 |
<div class="modal fade" id="batchingModal" tabindex="-1" aria-labelledby="batchingModalLabel" aria-hidden="true">
|
| 557 |
+
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="batchingModalLabel">⚡ Dynamic Batching</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>Improves efficiency with adaptive batching (2-4 frames), boosting throughput by ~30-50%, where \( \text{Throughput} \propto B \cdot \text{FPS}_{\text{base}} \).</p></div></div></div>
|
| 558 |
</div>
|
| 559 |
<div class="modal fade" id="sageModal" tabindex="-1" aria-labelledby="sageModalLabel" aria-hidden="true">
|
| 560 |
+
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="sageModalLabel">🧙♂️ Sage-Attention</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>Streamlines attention layers, saving ~5-10% processing time, expressed as \( T_{\text{attn}} \approx 0.9 \cdot T_{\text{base_attn}} \).</p></div></div></div>
|
| 561 |
</div>
|
| 562 |
<div class="modal fade" id="tcmallocModal" tabindex="-1" aria-labelledby="tcmallocModalLabel" aria-hidden="true">
|
| 563 |
+
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="tcmallocModalLabel">💾 tcmalloc</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>Enhances memory management, reducing overhead by ~5-20%, with \( O_{\text{mem}} \approx 0.8 \cdot O_{\text{glibc}} \).</p></div></div></div>
|
| 564 |
</div>
|
| 565 |
<div class="modal fade" id="cudaModal" tabindex="-1" aria-labelledby="cudaModalLabel" aria-hidden="true">
|
| 566 |
+
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="cudaModalLabel">⚡ CUDA Tweaks</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>Optimizes CUDA allocation, cutting latency by ~10-15%, where \( L_{\text{CUDA}} \approx 0.85 \cdot L_{\text{base}} \).</p></div></div></div>
|
| 567 |
</div>
|
| 568 |
<div class="modal fade" id="dynamicModal" tabindex="-1" aria-labelledby="dynamicModalLabel" aria-hidden="true">
|
| 569 |
+
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="dynamicModalLabel">🚀 Dynamic Scheduling</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>Adapts queues to reduce task time by ~15-20%, calculated as \( T_{\text{sched}} \approx 0.8 \cdot T_{\text{base_sched}} \).</p></div></div></div>
|
| 570 |
</div>
|
| 571 |
<div class="modal fade" id="cacheModal" tabindex="-1" aria-labelledby="cacheModalLabel" aria-hidden="true">
|
| 572 |
+
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="cacheModalLabel">📦 Memory Cache</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>Preloads data to cut swaps by ~25%, with \( M_{\text{swap}} \approx 0.75 \cdot M_{\text{base_swap}} \).</p></div></div></div>
|
| 573 |
</div>
|
| 574 |
<div class="modal fade" id="powerModal" tabindex="-1" aria-labelledby="powerModalLabel" aria-hidden="true">
|
| 575 |
+
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="powerModalLabel">🔋 Power Optimization</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>Reduces power draw by ~20-30% during idle, expressed as \( P_{\text{idle}} \approx 0.7 \cdot P_{\text{base_idle}} \).</p></div></div></div>
|
| 576 |
</div>
|
| 577 |
<div class="modal fade" id="threadModal" tabindex="-1" aria-labelledby="threadModalLabel" aria-hidden="true">
|
| 578 |
+
<div class="modal-dialog modal-lg"><div class="modal-content bg-ghost-card text-white"><div class="modal-header"><h5 class="modal-title" id="threadModalLabel">🧵 Thread Tuning</h5><button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><p>Optimizes threads for ~10-15% CPU efficiency, \( C_{\text{thread}} \approx 0.85 \cdot C_{\text{base_thread}} \).</p></div></div></div>
|
| 579 |
</div>
|
| 580 |
|
| 581 |
<!-- Bootstrap JS -->
|