Bundle export

Documentation Editor

Bundle export

https://morgondag.io/pages/bit-bundle-export

Bundle export is a simple data format that contains all the instructions needed to render the assets exactly like in the editor. It can be reached in the export menu or by pressing CTRL+B. The bundle format collects all sprites, asset data, and entity data and exports this into a minimal zip package. If there are any color palettes applied before exporting, all the exported sprites will have that color applied to them.

File structure

The zip file can look like this when exported

bit.json: It contains your entire project data, library assets, and scene entities as well as the scene configurations.

timelapse.json: It contains all the past states of the bit.json data. Use this to step through your asset history and time-lapse.

bit.txt: Just an informative editor file.

.png-files: All your used library assets sprites and sprite sheets. These have ids that are connected with the bit.json data ids.

JSON data

The data file contains raw JSON that can be parsed to import/render the bundle. 

bit.json
Key Type Description
name string the project name
version string (semver) what version of the editor was this project exported width.
width number the project and scene's width.
height number the project and scene's height.
scale number the project and scene's pixel rendering scale. This explains how large the entities should be rendered at.
background Array the background color expressed in a array with three RGB values between 0-255.
created timestamp a timestamp when this project was created.
exported timestamp a timestamp when this project was exported.
updated timestamp a timestamp when this project was last updated(saved).
isTransparent boolean a boolean if this project should have a transparent background instead of the background color.
isAnimated boolean is this project animated or should the animations be disabled.
palette Array this contains all the color palette data.
scene Array this contains all the scene entities' data.
assets Array this contains all library assets' data.

 

palette - Array

Key Type Description
convertFrom array a color expressed in a array with three RGB values between 0-255. This is the color that should be converted from.
covertTo array a color expressed in a array with three RGB values between 0-255. This is the color the above color should be converted to.

 

assets - Array
Key Type Description
id string the unique id of the asset.
name string the name that shows up in the editor.
sprite string the PNG filename of this asset. this should match the one of the exported PNG files in the zip.
category string the asset's category name.
subcategory string the asset's subcategory name.
created timestamp when this asset was created.
updated timestamp when this asset was updated.
defaultTile number the asset's default tile to render if there is no active sprite sheet animation on entities.
spriteSize object with x and y contains number, this is the expected sprites full size.
tileSize object with x and y contains number, this is the configured tile size.
animations array contains the sprite sheet animation data.

 

assets - animations - Array
Key Type Description
id string the unique id of the animation.
currentName string the name of the sprite sheet animation
name string the name of the sprite sheet animation
frameskip number how many frames to skip before going to the next tile.
tiles number-array contains the index of the asset's tile to show in a sequential step.

 

scene - Array
Key Type Description
id string the unique id of the scene entity.
assetId string the library asset to use for this entity.
name string the name of the sprite sheet animation
isActive boolean if this entity is active in the editor.
data object the data configuration for this entity.

 

scene data - object
Key Type Description
alpha number the rendering alpha from 0-255, where 255 is no transparent.
animationIndex number the current selected sprite sheet animation index. -1 if none is picked.
animationsEnabled boolean if tweening should be enabled or not.
defaultTile number the current selected sprite sheet tile to render.
flipX boolean flip the entity horizontally.
flipY boolean flip the entity vertically.
initialAnimationDelay float initial tween delay when the scene is rendered.
isLocked boolean if the entity is locked in the scene editor.
isVisible boolean toggle visibility for the entity.
mirror Object X & Y number the mirror offset numbers in x and y.
mirrorX boolean should the entity be mirrored horizontally.
mirrorY boolean should the entity be mirrored vertically.
position object & Y number the entities position on the screen from the center of the scene.
repeatXCount number how many times the entity's render should be repeated horizontally. One per each side of the original.
repeatXOffset number the distance between the repeated copies horizontally.
repeatYCount number how many times the entity's render should be repeated vertically. One per each side of the original.
repeatYOffset number the distance between the repeated copies vertically.
rotateRepeat number how many times should the entity be rendered with a rotated variant behind.
rotateRepeatSpace number amount of degrees between each rotated repeat.
animatedrotateRepeatSpeed float rotate speed to increment entity's rotation per frame, for the repeated counted elements.
rotation number the entity's base rotation without being animated.
rotationSpeed float rotate speed to increment entity's rotation per frame.
tint Array-number 0-1 * 255 a color expressed in a array with three RGB values between 0-1 but can be rounded and * 255. The current entity's color tint, this is applied after color palette.
animations array the configuration object for tween animations.

 

scene - animations (tweens) - Array
Key Type Description
delay float ms before the animation starts tweening.
duration float the duration in ms of the tween.
easing enum easing algorithms to use.
data object contains a bool per toggled tween option followed by a number. If the option is set to true you should animate that part.

Asset vs Entity

Set up the scene.

Easing algorithms

Easing is set up as ways to control how the different number changes are translated over time. See https://easings.net

Easing used and their index:

enum Easing {
Linear,
QuadIn,
QuadOut,
QuadInOut,
CubeIn,
CubeOut,
CubeInOut,
QuartIn,
QuartOut,
QuartInOut,
QuintIn,
QuintOut,
QuintInOut,
SineIn,
SineOut,
SineInOut,
ExpoIn,
ExpoOut,
ExpoInOut,
CircIn,
CircOut,
CircInOut,
};

Render loop

The render loop is set to 60fps. Speeding this up will not affect tween but will have an impact on sprite sheets animations, frame-delays, and rotations.

There is a tween update pass, update pass, and then a render loop for each of the entities in the scene array of the main object. These are rendered in a reveres for-loop.