asefa
    TypeScript icon, indicating that this package has built-in type declarations

    0.2.0 • Public • Published

    asefa

    js library to manage aseprite exported json spritesheet frame animation

    Install

    npm i asefa

    Usage (Browser CSS sprite)

    <body>
      <main>
        <div id="ss-display" class="sprite"></div>
      </main>
    
      <script src="path/to/asefa.js"></script>
      <script defer>
        ;(async () => {
          // Load ss-json
          const asess = await new asefa.Spritesheet().load(
            'path/to/your-cool-ss.json'
          )
    
          // Set up DOM to show sprite
          const el = document.getElementById('ss-display')
          el.style.background = `url(${'path/to/your-cool-ss.png'})`
          el.style.imageRendering = 'pixelated' // Assuming pixel-art (not necessary)
    
          // Update DOM to match frame
          const frame = asess.frames[1]
          el.style.width = `${frame.width}px`
          el.style.height = `${frame.height}px`
          el.style.backgroundPosition = `-${frame.x}px -${frame.y}px`
        })()
      </script>
    </body>

    See examples for more.

    Documentation

    TODO

    Development

    Setup

    npm install

    Build

    • Dev build: npm run dev or npm start
    • Production build: npm run build
    • Package: npm run pack

    Test

    npm run test

    Prerequisites

    • Tested aseprite version: v1.2.3-x64

    Keywords

    Install

    npm i asefa

    DownloadsWeekly Downloads

    6

    Version

    0.2.0

    License

    MIT

    Unpacked Size

    186 kB

    Total Files

    19

    Last publish

    Collaborators

    • pentamania