InfiniCanvas

Twitter | Reddit

Table of Contents

• About
• Building
• Tutorial
  • Panning and Zooming
  • Placing Tiles
• Contributing
  • Bug Reports and Feature Requests
  • Code Contributions
• Contributors
• License

About

InfiniCanvas is an open source multiplayer experience in which users can place colored tiles on an infinite canvas. It's currently hosted on canvas.caltrop.dev!

Building

Navigate to the directory in which you want to save the project in.

Clone the repository (this will create a new folder).

$ git clone https://github.com/caltropuwu/infinicanvas

Move into the directory.

$ cd infinicanvas

Install dependencies.

$ npm install --save

Rename creds.example.json to creds.json (located in /backend) and fill out all relevant information.

InfiniCanvas uses MySQL to store data. Make sure a server is running locally. Create a database and execute the queries found in /tables.sql.

Start the application

$ node --harmony app.js

The server should now be online on http://localhost:5000/!

Tutorial

In the following you will learn about the basics of navigating and editing the canvas!

Panning-and-Zooming

There are a total of 3 different ways to pan the camera across the canvas:

• Dragging the canvas
• Clicking on a tile to center it
• Using the Keyboard movement keys (Default: wasd or arrow-keys)

The first two methods are also available for mobile users!

You may zoom the camera in and out by using the mousewheel (on desktop) or pinching the screen (on mobile).

Placing-Tiles

Place tiles by dragging tiles from the color menu (located at the bottom-center of the screen) onto the canvas. You can also use the keyboard shortcut ctrl and shift to cycle through tiles. Pressing e toggles holding a tile.

Contributing

You may be interested in contributing to this project, in the following section you will find out how to file Issues and submit code.

Bug-Reports-and-Feature-Requests

You can report Bugs and unintended behaviour here. Feature requests and suggestions can be submitted here.

If you have an unrelated issue you can submit it here.

Code-Contributions

Code contributions are greatly appreciated. You can contribute code by forking the project and filing pull-requests here. Please note that all contributions need to be reviewed before being instated.

Contributors

Shoutouts to:

• dot-underscore-dot

License

The InfiniCanvas project is licensed under the GNU General Public License v3.0.