pathser v2.4.6

Patsher.js 2D Game Engine

Introduction

Patsher.js is a powerful 2D game engine designed to simplify the process of creating games. It provides a wide range of features and functionalities to help game developers bring their ideas to life. This documentation serves as a guide to help you understand and utilize the capabilities of Patsher.js.

Table of Contents

• Installation
• Getting Started
• Components
• Systems
• Plugins
• Input
• Physics
• Audio
• Graphics
• Examples
• Community and Social

Installation

To install Patsher.js, you can use npm or yarn:

npm install patsher

Getting Started

To get started with Patsher.js, you can follow these steps:

1. Import the Patsher module in your JavaScript file:

import Patsher from 'patsher';

2. Create a new instance of the Patsher engine:

const patsher = new Patsher();

3. Initialize the engine and start the game loop:

patsher.init();
patsher.start();

Components

Patsher.js provides a component-based architecture for building game objects. Components are reusable modules that define the behavior and properties of game objects. Some commonly used components include:

• Transform: Defines the position, rotation, and scale of a game object.
• SpriteRenderer: Renders a sprite on a game object.
• Collider: Handles collision detection and response.
• Rigidbody: Simulates physics movement and forces.

To create a game object with components, you can use the createEntity method:

const entity = patsher.createEntity();
entity.addComponent(Transform);
entity.addComponent(SpriteRenderer, { sprite: 'player.png' });

Systems

Systems in Patsher.js are used to process and update game objects. They handle the logic and behavior of game objects that have specific components. Some commonly used systems include:

• InputSystem: Handles user input and triggers actions.
• PhysicsSystem: Simulates physics-based movement and collisions.
• RenderSystem: Renders game objects on the screen.

To create a custom system in Patsher.js, you can define a class that extends the System class provided by Patsher.js. Here's an example of creating a custom system:

class CustomSystem extends System {
  update(dt) {
    // Logic for updating game objects with specific components
  }
}

You can then add the system to your Patsher instance using the addSystem method:

const customSystem = new CustomSystem();
patsher.addSystem(customSystem);

The system's update method will be called automatically in every frame of the game loop, allowing you to process and update game objects based on their components.

Input

Patsher.js provides a simple and intuitive input system for handling user input. It supports keyboard, mouse, and touch inputs. Here's an example of handling a keyboard input:

patsher.onKeyPress('Space', () => {
  // Perform an action on Space key press
});

You can also check the state of a specific key using the isKeyDown method:

if (patsher.isKeyDown('ArrowRight')) {
  // Perform an action while the ArrowRight key is held down
}

Physics

Patsher.js includes a physics system that allows you to simulate physics-based movement and collisions in your game. You can define colliders and rigidbodies for your game objects to interact with the physics system. Here's an example of adding physics components to a game object:

const entity = patsher.createEntity();
entity.addComponent(Collider, { width: 32, height: 32 });
entity.addComponent(Rigidbody, { mass: 1 });
var collisionShape = new Pathser.CollisionShape2D(32, 32);
entity.addComponent(engine.sprite("player.png", collisionShape);

The physics system will handle collision detection and response between colliders, as well as apply forces and simulate movement based on rigidbody properties.

Audio

Patsher.js provides an audio system for playing sound effects and background music in your game. You can load audio files and play them using the playSound method. Here's an example:

patsher.loadSound('explosion.wav', 'explosion');
patsher.playSound('explosion');

You can also control the volume and loop properties of the audio using optional parameters.

Graphics

Patsher.js offers various graphics capabilities for rendering game objects and creating visual effects. It supports sprite rendering, text rendering, and custom shaders. You can render sprites using the SpriteRenderer component or by directly using the drawSprite method provided by Patsher.js. Here's an example of rendering a sprite using the drawSprite method:

patsher.drawSprite('player.png', x, y);

You can also apply transformations such as rotation and scaling to the sprite using optional parameters.

Examples

To help you get started with Patsher.js, here are a few examples of common game mechanics and features:

• Platformer: Create a platformer game with player movement, jumping, and collision detection with platforms.
• Top-down Shooter: Build a top-down shooter game with player movement, shooting projectiles, and enemy AI.
• Puzzle Game: Develop a puzzle game with various puzzles and mechanics, such as matching colors or solving mazes.

You can find more examples and code snippets in the Patsher.js documentation and GitHub repository.

Community and Social

Patsher.js has a vibrant and supportive community of game developers. You can join the community and engage with other developers through various channels:

• Discord: Join the Patsher.js Discord server to connect with other developers, ask questions, and share your games and projects.
• Forums: Participate in the Patsher.js forums to discuss game development, share ideas, and get help from the community.
• Social Media: Follow Patsher.js on social media platforms such as Twitter and Facebook to stay updated on the latest news, tutorials, and events.

Additionally, you can contribute to the Patsher.js project by submitting bug reports, feature requests, or even contributing code improvements through the GitHub repository.

Conclusion

This documentation provides an overview of the features and functionalities of Patsher.js, a powerful 2D game engine. With Patsher.js, you can create amazing games with ease and flexibility. Explore the documentation further to learn about advanced topics and dive into specific aspects of game development with Patsher.js.

Happy game development with Patsher.js!