jobase.github.io/sketches.html at main · JoBase/jobase.github.io · 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
<!DOCTYPE html>
<html>
    <head>
        <meta name = viewport content = "width=device-width,initial-scale=1">
        <link rel = icon href = data/images/favicon.ico sizes = "16x16 32x32 48x48 64x64">

        <script src = data/js/setup.js></script>
        <script src = data/js/code.js></script>

        <link rel = stylesheet href = data/css/fontawesome.css>
        <link rel = stylesheet href = data/css/all.css>
        <link rel = stylesheet href = data/css/main.css>

        <title>JoBase &middot; Sketches</title>
    </head>

    <body>
        <section class = top>
            <a href = "/">JoBase</a>
            <i class = "fa-solid fa-bars"></i>
            <i class = "fa-solid fa-sun"></i>
            <a href = lessons>Lessons</a>
            <a href = demos class = this>Demos</a>
            <a href = games>Games</a>
            <a href = reference>Reference</a>
            <a href = download>Download</a>

            <a href = https://github.com/JoBase target = _blank>
                <i class = "fa-brands fa-github"></i>
            </a>

            <a href = https://discord.gg/DzHyvZfa5q target = _blank>
                <i class = "fa-brands fa-discord"></i>
            </a>
        </section>

        <section class = main>
            <h1>Sketches</h1>

            <p>
                Use the mouse to draw lines on the screen.
                Black lines have static bodies and red lines have dynamic bodies.
                If you have JoBase installed, you can run this demo by typing the following command.
            </p>

            <pre>python -m JoBase.examples.sketches</pre>

            <div class = display>
                <canvas></canvas>

                <div>
                    <span class = text></span>
                    <div class = loader></div>
                </div>
            </div>

            <script>
                demo("sketches")
            </script>
        </section>

        <footer>
            <span>
                &copy; Copyright <span id = year></span> JoBase &middot; <a href = mailto:hello@jobase.org>hello@jobase.org</a>
            </span>
        </footer>
    </body>
</html>