flock/cubeart.html at main · flipcomputing/flock · 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
82
83
84
85
86
87
88
89
90
91
92
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Flock standalone example</title>

    <style>
      body {
        font-family:
          "Atkinson Hyperlegible Next", "Asap", Helvetica, Arial, Lucida,
          sans-serif !important;
      }
    </style>
  </head>
  <body>
    <canvas
      id="renderCanvas"
      touch-action="none"
      style="width: 640px; height: 360px"
      tabindex="0"
    ></canvas>
    <script id="flock" type="application/flock">
      // Made with Flock XR
      let player = "player"; let box1 = "box1"; let camera = "camera";


      (async () => {
        setSky("#ffffff");
        createMap("NONE", {
                          color: "#ffffff",
                          materialName: "none.png",
                          alpha: 1
                      });
      })();

      (async () => {
        printText({ text: "🌈 Hello", duration: 30, color: "#000080" });
        buttonControls("ARROWS", "AUTO", "#cc33cc");
        camera = getCamera();
      })();

      (async () => {
        for (let count = 0; count < 100; count++) {
          box1 = createBox("box1__=@2jbH*.[K/:Y@6m1_fK", { color: randomColour(), width: (randomInteger(1, 5)), height: (randomInteger(1, 5)), depth: (randomInteger(1, 5)), position: [(randomInteger(-20, 20)), (randomInteger(0, 10)), (randomInteger(-20, 20))] });
        await wait(0);
        }
        await setAlpha(box1, { value: 0.75 });
      })();

      (async () => {
        player = createCharacter({
                          modelName: 'Liz6.glb',
                          modelId: 'player__{P^*3SH2g,CqI`9/9cQC',
                          scale: 1,
                          position: { x: 0, y: 0, z: 0 },
                          colors: {
                                hair: "#ffff00",
                                skin: "#fcdace",
                                eyes: "#009900",
                                sleeves: "#33ffff",
                                shorts: "#99ffff",
                                tshirt: "#66ffff"
                          }
                        });
        await setPhysics(player, "DYNAMIC");
        await attachCamera(player, { radius: 7, front: false });
      })();

      forever(async function(){
        if (actionPressed("FORWARD")) {
          moveForward(player, 3);
          switchAnimation(player, { animationName: "Walk" });
        } else if (actionPressed("BACKWARD")) {
          moveForward(player, (-3));
          switchAnimation(player, { animationName: "Walk" });
        } else if (actionPressed("LEFT")) {
          await rotate(camera, { x: 0, y: 1, z: 0 });
        } else if (actionPressed("RIGHT")) {
          await rotate(camera, { x: 0, y: (-1), z: 0 });
        } else {
          switchAnimation(player, { animationName: "Idle" });
        }
      });
    </script>

    <script type="module">
      import "https://flipcomputing.github.io/flock/flock.js";
    </script>
  </body>
</html>