Bytebeat live coding A-Frame component, for live coding Bytebeat in the metaverse.
Use this component in A-Frame, together with the Networked-Aframe library and the Aframe-Super-Keyboard component.
Add the bytebeat component to your desired A-Frame entity to include the Bytbeat Live Coding environment. A child entity including the Super-Keyboard component needs to be attached:
<a-scene>
<a-entity bytebeat="">
<a-entity
id="keyboard"
super-keyboard="hand:; imagePath:./aframe-bytebeat/;multipleInputs:true;align:center"
byte-keyboard
position="0 -0.6 +0.6"
rotation="-30 0 0"
></a-entity>
</a-entity>
</a-scene>
Property | Description | Default |
---|---|---|
code | current source code | _ |
Add template of the live-coding object, including an Aframe-Super-Keyboard component, to your A-Scene assets:
<a-assets>
<template id="bytebeat-template">
<a-entity
class="raycastable"
geometry="primitive: box"
material="wireframe:true"
text="value:Hello World;side:double"
resonance-audio-src="
src:;
loop: true;
autoplay: true;"
bytebeat=""
>
<a-entity
id="keyboard"
super-keyboard="hand:; imagePath:./aframe-bytebeat/;multipleInputs:true;align:center"
byte-keyboard
position="0 -0.6 +0.6"
rotation="-30 0 0"
></a-entity>
</a-entity>
</template>
if (!NAF.schemas.hasTemplate("#bytebeat-template")) {
NAF.schemas.add({
template: "#bytebeat-template",
components: [
"position",
{
component: "bytebeat",
property: "code",
},
],
});
}
<!-- Player Setting -->
<a-entity
id="rig"
networked="template:#rig-template;"
movement-controls
bytebeat-persistent="template:#bytebeat-template; keyCode:32"
>
Property | Description | Default |
---|---|---|
template | template of the object to be spawned | '' |
keyCode | key code to trigger spawned object | 32 (space) |
See the Metabeat metaverse system for implementation: Metabeat
Bytebeat is know from the work by Viznut, found at viznut.fi