File size: 4,712 Bytes
7267a26
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>DiffRhythm2 - Pinokio Installer</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <header>
            <h1>🎵 DiffRhythm2 Pinokio Installer</h1>
            <p class="subtitle">Install and run DiffRhythm2 - Text-to-Music Generation</p>
            <a href="https://huggingface.co/spaces/akhaliq/anycoder" class="built-with">Built with anycoder</a>
        </header>

        <main>
            <div class="card">
                <h2>About DiffRhythm2</h2>
                <p>DiffRhythm2 is a state-of-the-art text-to-music generation model that creates musical compositions from text descriptions.</p>
                
                <div class="model-info">
                    <h3>Model Information</h3>
                    <ul>
                        <li><strong>Model:</strong> ASLP-lab/DiffRhythm2</li>
                        <li><strong>Type:</strong> Text-to-Music Generation</li>
                        <li><strong>Framework:</strong> Diffusers</li>
                        <li><strong>License:</strong> MIT</li>
                    </ul>
                </div>
            </div>

            <div class="card">
                <h2>Installation</h2>
                <div class="installation-controls">
                    <button id="installBtn" class="btn btn-primary">Install DiffRhythm2</button>
                    <button id="downloadScriptBtn" class="btn btn-secondary">Download Pinokio Script</button>
                </div>
                
                <div id="progressContainer" class="progress-container hidden">
                    <div class="progress-info">
                        <span id="progressText">Initializing installation...</span>
                        <span id="progressPercent">0%</span>
                    </div>
                    <div class="progress-bar">
                        <div id="progressFill" class="progress-fill"></div>
                    </div>
                </div>

                <div id="status" class="status-message"></div>
            </div>

            <div class="card">
                <h2>Text-to-Music Generation</h2>
                <div class="generation-controls">
                    <textarea id="promptInput" placeholder="Enter your music description (e.g., 'upbeat electronic dance music with synth melodies')" rows="4"></textarea>
                    <div class="params">
                        <label for="duration">Duration (seconds):</label>
                        <input type="number" id="duration" value="10" min="1" max="30">
                        
                        <label for="guidance">Guidance Scale:</label>
                        <input type="number" id="guidance" value="7.5" min="1" max="20" step="0.1">
                    </div>
                    <button id="generateBtn" class="btn btn-primary" disabled>Generate Music</button>
                </div>

                <div id="generationResult" class="result-container hidden">
                    <h3>Generated Music</h3>
                    <audio id="audioPlayer" controls class="audio-player"></audio>
                    <button id="downloadBtn" class="btn btn-secondary">Download Audio</button>
                </div>
            </div>

            <div class="card">
                <h2>Examples</h2>
                <div class="examples">
                    <div class="example-item">
                        <p>"Classical piano piece with emotional melody"</p>
                        <button class="btn btn-small" onclick="loadExample(this)">Use</button>
                    </div>
                    <div class="example-item">
                        <p>"Jazz trio with smooth saxophone and walking bass"</p>
                        <button class="btn btn-small" onclick="loadExample(this)">Use</button>
                    </div>
                    <div class="example-item">
                        <p>"Epic orchestral music with choir and brass"</p>
                        <button class="btn btn-small" onclick="loadExample(this)">Use</button>
                    </div>
                    <div class="example-item">
                        <p>"Chill lo-fi hip hop with rain sounds"</p>
                        <button class="btn btn-small" onclick="loadExample(this)">Use</button>
                    </div>
                </div>
            </div>
        </main>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/@huggingface/transformers"></script>
    <script src="index.js"></script>
</body>
</html>