retree/tree.html at main · redspacecat/retree · GitHub

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
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Remix Tree</title>
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1"></script>
    <script src="https://cdn.jsdelivr.net/npm/treant-js@1.0.1/Treant.js"></script>
    <script src="/assets/libraries/raphael.js"></script>
    <script src="/assets/libraries/jquery.min.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/treant-js@1.0.1/Treant.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Zalando+Sans:ital,wght@0,200..900;1,200..900&display=swap"
        rel="stylesheet">
    <link rel="stylesheet" href="/assets/style.css">
</head>

<body>
    <div id="loading-container">
        <img src="/assets/images/ajax_loader_blue_48.gif" id="loader">
        <div id="loading-info">Loading...</div>
    </div>
    <div id="info">
        <span id="title">
            <span>Showing remix tree for </span>
            <a target="_blank" id="title-link">...</a>

            <img src="/assets/images/refresh.png"
                style="margin-left: 5px;width: 30px;height: 30px;vertical-align: middle;margin-top: 5px;"
                title="Regenerate remix tree (might take a while)" onclick="refresh()">
        </span>
        <form style="display: inline;margin: 0 auto;" onsubmit="handleSubmit(event)" action="">
            <select onchange="switchViewer(this.value)">
                <option disabled>Choose a Viewer</option>
                <option value="scratch">Scratch</option>
                <option value="treant">Treant.js (custom)</option>
            </select>
            <input type="text" placeholder='Enter a project id' pattern="^[0-9]*$" onkeypress="validate(event)"
                id="idPicker">
            <input type="submit" value="Go" style="padding: 0px 2px;">
        </form>
        <div id="buttons" hidden>
            <button id="prev">⬅️ See more (<span id="prevCount"></span>)</button>
            <button id="next">See more (<span id="nextCount"></span>) ➡️</button>
        </div>
    </div>
    <div id="project-preview" hidden>
        <img id="preview-img" style="width: 200px;height: 150px;">
        <span id="preview-title"></span><br>
        <span id="preview-author"></span><br>
        <span id="preview-created"></span><br>
        <span id="preview-loves"></span>
        <span id="preview-faves"></span>
        <span id="preview-views"></span>
        <span id="preview-remixes"></span>
    </div>
    <div class="chart" id="treant-remixtree" hidden></div>
    <div id="container" style="display: none;">
        <div id="tree-container">
            <div id="tree"></div>
            <div id="zoomContainer" hidden>
                <div id="zoomIn" class="zoom" onclick="App.wrapper.zoomIn()">
                    <img src="/assets/images/zoomin.png">
                </div>
                <div id="zoomEqual" class="zoom" onclick="App.wrapper.zoomEqual()">
                    <img src="/assets/images/zoomeq.png">
                </div>
                <div id="zoomOut" class="zoom" onclick="App.wrapper.zoomOut()">
                    <img src="/assets/images/zoomout.png">
                </div>


            </div>
        </div>
    </div>
    <script src="/assets/main.js"></script>
</body>

</html>