Hugging Face's logo

Spaces:
quymao
/
anycoder-795c2ad6
Running

App Files Community
quymao commited on
Commit
7267a26
·
verified ·
1 Parent(s): f3bf31c

Upload index.html with huggingface_hub

Browse files
Files changed (1) hide show
  1. index.html +101 -19
index.html CHANGED
@@ -1,19 +1,101 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>DiffRhythm2 - Pinokio Installer</title>
7
+ <link rel="stylesheet" href="style.css">
8
+ </head>
9
+ <body>
10
+ <div class="container">
11
+ <header>
12
+ <h1>🎵 DiffRhythm2 Pinokio Installer</h1>
13
+ <p class="subtitle">Install and run DiffRhythm2 - Text-to-Music Generation</p>
14
+ <a href="https://huggingface.co/spaces/akhaliq/anycoder" class="built-with">Built with anycoder</a>
15
+ </header>
16
+
17
+ <main>
18
+ <div class="card">
19
+ <h2>About DiffRhythm2</h2>
20
+ <p>DiffRhythm2 is a state-of-the-art text-to-music generation model that creates musical compositions from text descriptions.</p>
21
+
22
+ <div class="model-info">
23
+ <h3>Model Information</h3>
24
+ <ul>
25
+ <li><strong>Model:</strong> ASLP-lab/DiffRhythm2</li>
26
+ <li><strong>Type:</strong> Text-to-Music Generation</li>
27
+ <li><strong>Framework:</strong> Diffusers</li>
28
+ <li><strong>License:</strong> MIT</li>
29
+ </ul>
30
+ </div>
31
+ </div>
32
+
33
+ <div class="card">
34
+ <h2>Installation</h2>
35
+ <div class="installation-controls">
36
+ <button id="installBtn" class="btn btn-primary">Install DiffRhythm2</button>
37
+ <button id="downloadScriptBtn" class="btn btn-secondary">Download Pinokio Script</button>
38
+ </div>
39
+
40
+ <div id="progressContainer" class="progress-container hidden">
41
+ <div class="progress-info">
42
+ <span id="progressText">Initializing installation...</span>
43
+ <span id="progressPercent">0%</span>
44
+ </div>
45
+ <div class="progress-bar">
46
+ <div id="progressFill" class="progress-fill"></div>
47
+ </div>
48
+ </div>
49
+
50
+ <div id="status" class="status-message"></div>
51
+ </div>
52
+
53
+ <div class="card">
54
+ <h2>Text-to-Music Generation</h2>
55
+ <div class="generation-controls">
56
+ <textarea id="promptInput" placeholder="Enter your music description (e.g., 'upbeat electronic dance music with synth melodies')" rows="4"></textarea>
57
+ <div class="params">
58
+ <label for="duration">Duration (seconds):</label>
59
+ <input type="number" id="duration" value="10" min="1" max="30">
60
+
61
+ <label for="guidance">Guidance Scale:</label>
62
+ <input type="number" id="guidance" value="7.5" min="1" max="20" step="0.1">
63
+ </div>
64
+ <button id="generateBtn" class="btn btn-primary" disabled>Generate Music</button>
65
+ </div>
66
+
67
+ <div id="generationResult" class="result-container hidden">
68
+ <h3>Generated Music</h3>
69
+ <audio id="audioPlayer" controls class="audio-player"></audio>
70
+ <button id="downloadBtn" class="btn btn-secondary">Download Audio</button>
71
+ </div>
72
+ </div>
73
+
74
+ <div class="card">
75
+ <h2>Examples</h2>
76
+ <div class="examples">
77
+ <div class="example-item">
78
+ <p>"Classical piano piece with emotional melody"</p>
79
+ <button class="btn btn-small" onclick="loadExample(this)">Use</button>
80
+ </div>
81
+ <div class="example-item">
82
+ <p>"Jazz trio with smooth saxophone and walking bass"</p>
83
+ <button class="btn btn-small" onclick="loadExample(this)">Use</button>
84
+ </div>
85
+ <div class="example-item">
86
+ <p>"Epic orchestral music with choir and brass"</p>
87
+ <button class="btn btn-small" onclick="loadExample(this)">Use</button>
88
+ </div>
89
+ <div class="example-item">
90
+ <p>"Chill lo-fi hip hop with rain sounds"</p>
91
+ <button class="btn btn-small" onclick="loadExample(this)">Use</button>
92
+ </div>
93
+ </div>
94
+ </div>
95
+ </main>
96
+ </div>
97
+
98
+ <script src="https://cdn.jsdelivr.net/npm/@huggingface/transformers"></script>
99
+ <script src="index.js"></script>
100
+ </body>
101
+ </html>