Changelog
KAPLAY is a fork of Kaboom.js, and the latest stable version of Kaboom.js was v3000.
We are working on version v4000 of KAPLAY, and we have added a lot of new features and improvements.
We also are working on version v3001 to make the transition from Kaboom to KAPLAY easier. This version will be 99.9% compatible with Kaboom, without some of the most recent features such as performance improvements.
- v4000: The new and next version of KAPLAY.
- v3001: The last version of KAPLAY compatible with Kaboom.
- v3000: The last stable version of Kaboom.js.
Input
-
added input bindings,
onButtonPress
,onButtonRelease
,onButtonDown
, and it’s corresponding boolean versions,isButtonPressed
,isButtonDown
andisButtonReleased
. (v3001/4000)kaplay({ // bind your buttons buttons: { jump: { keyboard: ["space", "up"], keyboardCode: "Space", // you can also use key codes gamepad: ["south"], }, }, }); onButtonPress("jump", () => { player.jump(); });
-
added
getButton(btn)
andsetButton(btn)
to get and set button bindings (v3001/4000)// ["space", "up"] debug.log(getButton("jump").keyboard); // change the jump button in keyboard to "w" setButton("jump", { keyboard: ["w"], // gamepad binding is not changed });
-
added
getLastInputDeviceType()
to get what was the last pressed device (v3001/4000)onButtonPress(() => { const lastInputDevice = getLastInputDeviceType(); // keyboard, mouse or gamepad // change icons, etc });
-
added the possibility of use arrays in all input handlers (v3001/4000)
onKeyPress(["w", "up"], () => { player.jump(); });
-
now gamepad events return what gamepad triggered the action (v3001/4000)
onGamepadButtonPress("south", (btn, gp) => { console.log(gp.index); // gamepad number on navigator's gamepad list });
-
added a fake cursor API (v4000)
const myCursor = add([ fakeMouse(), sprite("kat"), pos(100, 100), ]); myCursor.press(); // trigger onClick events if the mouse is over myCursor.release(); myCursor.move(vec2(100, 200)); // move as your wish
Physics
- added effector components:
areaEffector()
,buoyancyEffector()
,pointEffector()
,surfaceEffector()
. (v3001/4000) - added
constantForce()
component. (v3001/4000) - added
patrol()
component to move along a list of waypoints. (v3001/4000) - added
sentry()
component to notify when certain objects are in sight. (v3001/4000) - added
NavMesh
class for pathfinding on a mesh. (v3001/4000) - added
navigation()
component to calculate a list of waypoints on a graph. (v3001/4000) - now collision checks are only done if there’s area objects. (v3001/4000)
Game Object
-
added
getTreeRoot()
to get the game’s root object, which is the parent of all other objects (v3001/4000)// get the root object const root = getTreeRoot(); root.add(); // same as add() root.get(); // same as get()
-
added
GameObjRaw.tags
to get a game object’s tags. (v3001/4000)const obj = add([sprite("bean"), "enemy", "dangerous"]); // get the tags debug.log(obj.tags); // ["enemy", "dangerous"]
Components
-
added support to setters/getters syntax in
ScaleComp
andSpriteComp
components (v3001/4000)const obj = add([ sprite("bean"), scale(2), ]); // set it with = syntax obj.scale = vec2(3, 4); obj.sprite = "bag";
Rendering and Animation
-
added the
animate()
component to animate the properties of an object using keyframes. Check out Animation Example (v3001/4000)// prop to animate, frames, options rotatingBean.animate("angle", [0, 360], { duration: 2, direction: "forward", });
-
added
particles()
component to emit and draw particles. (v3001/4000) -
readded
layers()
and thelayer()
component. (v3001/4000)Before the
z()
component, there was alayer()
component that allowed you to control the draw order of objects. It was removed in v3000, but now it’s back from the void.// define the layers layers( [ "bg", "game", "ui", // the default layer ], "game", ); // use the layer component add([sprite("bg"), layer("bg")]);
-
added
SpriteComp.getCurAnim()
to get the current animation data (v3001/4000)const obj = add([ sprite("bean", { anim: "walk" }), ]); // get the current animation name debug.log(obj.getCurAnim().name); // "walk"
-
added
SpriteComp.getAnim()
for get any animation data (v3001/4000)loadSprite("bean", "bean.png", { sliceX: 4, sliceY: 1, anims: { walk: { from: 0, to: 3, }, }, }); const obj = add([ sprite("bean"), ]); // get the animation data debug.log(obj.getAnim("walk")); // { from: 0, to: 3 }
-
added
SpriteComp.hasAnim()
to check if an animation exists (v3001/4000)const obj = add([ sprite("bean", { anim: "walk" }), ]); // check if an animation exists debug.log(obj.hasAnim("walk")); // true
-
added
camFlash()
to flash the screen. (v3001/4000)camFlash(0.5, 0.5, 0.5, 0.5);
-
added support for radius in individual corners for
RectComp
component. (v3001/4000)add([ rect(100, 100, { radius: [10, 20, 30, 40], }), ]);
-
(! break) removed compatibilty to use two KAPLAY frames in the same page, due to perfomance improvements
-
fix error screen not showing with not Error object
Audio
-
now you can pass an
AudioBuffer
toloadSound()
(v4000) -
added
loadMusic()
to load streaming audio (doesn’t block in loading screen). (v3001/4000)loadMusic("bgm", "bgm.mp3"); // play the music play("bgm");
Math
-
added
Vec2.fromArray()
to convert an array to aVec2
. (v3001/4000)const point = Vec2.fromArray([100, 200]); // vec2(100, 200);
-
added
Vec2.toArray()
to convert aVec2
to an array. (v3001/4000)const point = vec2(100, 200); const arr = point.toArray(); // [100, 200]
-
added
chooseMultiple()
to choose a random element from an array. (v3001/4000)const numbers = [1, 2, 3, 4, 5]; const random = chooseMultiple(numbers, 3); // [3, 1, 5]
-
added
shuffle()
to shuffle an array. (v3001/4000)const numbers = [1, 2, 3, 4, 5]; shuffle(numbers); // [3, 1, 5, 2, 4]
Debug mode
-
added
outline()
,shader()
, andarea()
properties todebug.inspect
(v3001/4000) -
added
KAPLAYOpt.debugKey
for customizing the key used to toggle debug mode. (v3001/4000)kaplay({ debugKey: "l", });
-
added compatibility with custom properties in debug mode
const obj = add([ sprite("bean"), { health: 100, // on debug.inspect damage: 10, // on debug.inspect hp() { this.health -= this.damage; }, // not on debug.inspect }, ]); // see the custom properties in debug mode debug.inspect = true;
Helpers
All changes applies for both v3001 and v4000
- added
getSceneName()
to get the current scene name - added
Color.toArray()
to convert a color to an array - added global raycast function and raycast method to level
- added support for textured polygons
- added support for concave polygon drawing
- added support for arrays in uniforms
- added support for texture larger than 2048x2048
- added support for gravity direction
- added line join (bevel, miter, round) and line caps (square, round)
- added quadratic bezier and Catmull-Rom evaluation
- added evaluation of the first and second derivatives for all splines
- added higher order easing functions linear, steps and cubic-bezier
TypeScript
-
now you can type
get()
with a type parameter and passsing component types. (v4000)const player = get<BodyComp>("player");
Deprecations
All changes applies for both v3001 and v4000
- deprecated
kaboom()
in favor ofkaplay()
(you can still usekaboom*
) - deprecated
SpriteComp.curAnim()
in favor ofSpriteComp.getCurAnim().name
- deprecated
fadeIn
component in favor ofOpacityComp.fadeIn()
- deprecated
Event
,EventHandler
andEventController
in favor ofKEvent
,KEventHandler
andKEventController
Bug fixes
All changes applies for both v3001 and v4000
- (break) much typescript definitions was fixed, if you use typescript now maybe you see new errors that make your code strict
- fix error screen not showing with not Error object
- fix error where debug screen was scaling bad the blue rectangles
- fix error where error screen was not showing when the error was thrown in a input event
- fix error where fonts was cropped in the bottom