A minimalist component-based
osu! storboarding framework.
Create osu storyboard in a simple yet flexible way.
npm i @osbjs/osbjs
Get started >
Fast. Simple. Easy to pick up.
Creating storyboard has never been easier. Just tell osbjs where your beatmap folder and what the output osb filename should be. No extra configurations.
index.js
// Create storyboard instance.
const sb = new Storyboard('Artist - Song Name (Map Host).osb')
// Create a sprite
let sprite = new Sprite('sb/s.png', Layer.Background, Origin.Center)
// Add move command to sprite.
let startTime = 0,
endTime = 10000,
startPos = new OsbVector2(320, 345),
endPos = new OsbVector2(240, 480)
sprite.Move(startTime, endTime, startPos, endPos, Easing.OutExpo)
// Register sprite.
sb.registerComponents(sprite)
// Generate storyboard file.
sb.generate()
components/Flash.js
class Flash extends Component {
constructor(startTime, endTime) {
super()
this.startTime = startTime
this.endTime = endTime
}
generate() {
let startScale = new OsbVector2(854, 480),
endScale = new OsbVector2(854, 480)
let fl = new Sprite('sb/dot.png', Layer.Background)
fl.ScaleVec(this.startTime, this.startTime, startScale, endScale)
fl.Fade(this.startTime, this.endTime, 1, 0)
this.registerComponents(fl)
}
}
index.js
let fl = new Flash(0, 3000)
sb.registerComponents(fl)
Flexible. Reusable.
Since everything is a component, you can reuse your code and manage your project however you want. Even better, you can publish your own component and let others use it!