route-graphics 0.0.2-rc2 → 0.0.2-rc20

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Yuusoft
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,10 +1,108 @@
+# RouteGraphics
 
-## What is RouteGraphics
+A 2D graphics rendering interface that takes JSON input and renders pixels using PixiJS.
 
-RouteGraphics is a rendering interface for 2d visuals and audio. Originally developed to power RouteVN.
+⚠️ **Warning: This library is under active development and will have breaking changes in future versions.**
 
-The input is a declarative JSON Object
-The output is pixels drawn in a canvas
+## Installation
 
-The implementation uses PixiJS
+```bash
+npm install route-graphics
+```
 
+## Usage
+
+```javascript
+import RouteGraphics, {
+  SpriteRendererPlugin,
+  TextRendererPlugin,
+  ContainerRendererPlugin,
+  TextRevealingRendererPlugin,
+  GraphicsRendererPlugin,
+  AudioPlugin,
+  SliderRendererPlugin,
+  KeyframeTransitionPlugin,
+  createAssetBufferManager,
+} from 'route-graphics';
+
+// Load assets
+const assets = {
+  "file:bg1": {
+    url: "/public/background-1-1.png",
+    type: "image/png",
+  },
+  "file:circle-red": {
+    url: "/public/circle-red.png",
+    type: "image/png",
+  },
+  "file:bgm-1": {
+    url: "/public/bgm-1.mp3",
+    type: "audio/mpeg",
+  },
+};
+
+const assetBufferManager = createAssetBufferManager();
+await assetBufferManager.load(assets);
+const assetBufferMap = assetBufferManager.getBufferMap();
+
+// Initialize RouteGraphics
+const app = new RouteGraphics();
+await app.init({
+  width: 1920,
+  height: 1080,
+  eventHandler: (event, data) => {
+    // Handle events
+  },
+  plugins: [
+    new SpriteRendererPlugin(),
+    new TextRendererPlugin(),
+    new ContainerRendererPlugin(),
+    new TextRevealingRendererPlugin(),
+    new GraphicsRendererPlugin(),
+    new AudioPlugin(),
+    new SliderRendererPlugin(),
+    new KeyframeTransitionPlugin(),
+  ],
+});
+
+// Load assets and render
+await app.loadAssets(assetBufferMap);
+document.body.appendChild(app.canvas);
+
+// Render frame with elements and transitions
+app.render({
+  elements: [
+    {
+      id: "sprite1",
+      type: "sprite",
+      texture: "file:circle-red",
+      x: 100,
+      y: 100,
+    }
+  ],
+  transitions: []
+});
+```
+
+## Features
+
+- 2D graphics rendering
+- Sprite management
+- Text rendering with reveal effects
+- Container layouts
+- Transitions and animations
+- Interactive elements
+- Audio playback
+
+## Development
+
+```bash
+# Install dependencies
+bun install
+
+# Build
+bun run vt:generate
+
+# Lint
+bun run lint
+```