Hugging Face's logo

Spaces:
soiz1
/
s4s-editor
Build error

App Files Community
s4s-editor
File size: 2,036 Bytes 
30c32c8
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
 
class Button {
    constructor(addToClient, { id, label, shown }) {
        this.id = id;
        this.label = label;
        this._element = document.createElement("button");
        this._element.style = `position:absolute;left:0%;top:0%`
        if (shown === false) {
            this._element.style.display = "none";
        }
        if (label) {
            this._element.innerText = label;
        } else {
            this._element.innerText = "Button";
        }

        addToClient.AddToCanvas(this._element);
        if (addToClient.buttons[id]) {
            addToClient.buttons[id].dispose();
            delete addToClient.buttons[id];
        }
        addToClient.buttons[id] = this;
    }
    show() {
        this._element.style.display = "";
    }
    hide() {
        this._element.style.display = "none";
    }

    dispose() {
        this._element.remove();
    }
}

class UI {
    constructor(runtime) {
        this.runtime = runtime;
        this._div = document.createElement("div");
        this.Realign();

        this.buttons = {};
    }

    static Button = Button;

    /**
     * If we switch from editor to project page, our element div gets hidden away somewhere.
     * This function puts it back in place.
     */
    Realign() {
        this._div.style = `position: absolute;left: 0px;width: 100%;height: 100%;top: 0px;z-index: 1000;`
        if (!this.runtime.renderer) return;
        this.runtime.renderer.canvas.parentElement.prepend(this._div);
    }
    /**
     * Append an element to the div containing all UI elements.
     * @param {Element} element The element to add to the div.
     */
    AddToCanvas(element) {
        this._div.append(element);
        this.Realign();
    }

    /**
     * Dispose of all UI elements.
     */
    DisposeAll() {
        const buttons = Object.values(this.buttons);
        const elements = [].concat(buttons);

        elements.forEach(element => {
            element.dispose();
        })

        this.Realign();
    }
}

module.exports = UI;