Hugging Face's logo

Spaces:
Secondprinsipal
/
image
Running

App Files Community
image
File size: 2,548 Bytes 
4f33245
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
 
//
// SPDX-FileCopyrightText: Hadad <[email protected]>
// SPDX-License-Identifier: Apache-2.0
//

document.addEventListener('DOMContentLoaded', function() {
    const modelSelect = document.getElementById('modelSelect');
    const sizeSelect = document.getElementById('sizeSelect');
    const examplesGrid = document.getElementById('examplesGrid');

    if (typeof models !== 'undefined' && modelSelect) {
        models.forEach(model => {
            const option = document.createElement('option');
            option.value = model.value;
            option.textContent = model.label;
            modelSelect.appendChild(option);
        });
    }

    if (typeof sizes !== 'undefined' && sizeSelect) {
        Object.keys(sizes).forEach(category => {
            const optgroup = document.createElement('optgroup');
            optgroup.label = category.charAt(0).toUpperCase() +
                category.slice(1);

            sizes[category].forEach(size => {
                const option = document.createElement('option');
                option.value = size.value;
                option.textContent = size.label;
                optgroup.appendChild(option);
            });

            sizeSelect.appendChild(optgroup);
        });
    }

    if (typeof examples !== 'undefined' && examplesGrid) {
        examples.forEach(example => {
            const div = document.createElement('div');
            div.className = 'example-card';
            div.onclick = function() {
                triggerExample(
                    example.prompt,
                    example.model,
                    example.size
                );
            };

            const promptP = document.createElement('p');
            promptP.className = 'example-text';
            promptP.textContent = example.prompt;

            const metaP = document.createElement('p');
            metaP.className = 'example-meta';

            const modelSpan = document.createElement('span');
            modelSpan.className = 'example-model';
            modelSpan.textContent = example.modelLabel;

            metaP.appendChild(modelSpan);
            metaP.appendChild(
                document.createTextNode(' | ' + example.sizeLabel)
            );

            if (example.note) {
                metaP.appendChild(
                    document.createTextNode(' | ' + example.note)
                );
            }

            div.appendChild(promptP);
            div.appendChild(metaP);
            examplesGrid.appendChild(div);
        });
    }
});