A comprehensive API and graph editor for Rec Room's Circuits V2, featuring detailed data on chips and object boards, as well as a visual graph editor for creating circuit layouts.
The Circuits API provides access to detailed information about Rec Room's Circuits V2, including data on chips and object boards. The API is designed to be easy to use and integrate into your projects, allowing you to retrieve information about chips, object boards, and their properties. And even allows you to render a visual representation of a chip or object board in HTML and CSS!
To use the Circuits API, you will need:
- A modern web browser that supports ES6 modules (e.g., Chrome, Firefox, Edge).
- Basic knowledge of JavaScript and how to import modules.
- jQuery library included in your project, as the API uses jQuery for DOM manipulation in the rendering functions. You can include it via CDN:
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
- An internet connection to access the API data hosted on GitHub.
- (Optional) A code editor for working with the API in your projects.
To use the Circuits API, you can use one of two methods:
You can download the chip.mjs module file from the repository and import it into your project like so:
import { chip } from './chip.mjs';Alternatively, you can fetch the module directly from GitHub using a simple function like this:
// Step 1:
// - Function to import an external module from a URL
async function importExternal(url) {
const module = await fetch(url, {cache: 'no-cache'});
if (!module.ok) { throw new Error('Failed to load module: ' + url); }
const moduleCode = await module.text();
const blob = new Blob([moduleCode], { type: 'text/javascript' });
const blobUrl = URL.createObjectURL(blob);
try {
const module = await import(blobUrl);
if (Object.keys(module).length === 1) {
return module[Object.keys(module)[0]];
} else {
return module;
}
} finally {
URL.revokeObjectURL(blobUrl);
}
}
// Step 2:
// - Importing the chip module
const url = 'https://raw.githubusercontent.com/PckyDev/Rec-Room-Circuits-API/refs/heads/main/Source/assets/js/Modules/chip.mjs';
const chip = await importExternal(url);Once you have imported the chip module, you can initialize the API by calling the init method. This will load the chip, object board, and styling data from the API and prepare it for use in your project. Here's how you can do it:
// Initialize the Circuits API
await chip.init();After initializing the API, you can retrieve data about chips and object boards using the following methods:
// Get all chips
const allChips = chip.getAll(options);
// Options is an optional object that can have the following properties:
{
combineResults: boolean, // If true, combines chips and object boards into a single object with chip names as keys. Default is false.
}
// If combineResults is false (default), the result will be an object with two properties:
{
chips: { [chipName]: chipData, ... },
objects: { [objectName]: objectData, ... },
}
// If combineResults is true, the result will be an object with chip and object board data combined:
{
[chipOrObjectName]: chipOrObjectData,
...
}You can also retrieve data for a specific chip or object board by name:
// Get a specific chip by name
const chipData = chip.get(chipName);The API also provides a search function that allows you to find chips and object boards based on a search term:
// Search for chips and object boards by search query
const searchResults = chip.search(query, options);
// query is the search term (string)
// options is an optional object that can have the following properties:
{
chipsJSON: {}, // Optional JSON object to search within instead of the default chip data.
combineResults: boolean // If true, combines chips and object boards into a single object with chip names as keys. Default is false.
}The search method will by default fetch the chip data from the API for every search request, but you can also provide your own JSON data to search through using the chipsJSON option. This can be useful if you want to perform multiple searches without repeatedly fetching the data from the API.
The API includes a rendering function that allows you to create a visual representation of a chip or object board using HTML and CSS. You can use this function like so:
// Render a chip or object board by name
chip.render(element, chip, options);
// element is the DOM element (or jQuery selector) where the chip will be rendered
// You can leave element undefined or null to create the chip rendering data without actually rendering it to the DOM.
// It will return the chip rendering data so you can manipulate it or render it to the DOM yourself later if you want.
// chip is the name or data object of the chip or object board to render
// options is an optional object that can have the following properties:
{
log: boolean, // If true, logs the rendered chip data to the console for debugging purposes. Default is false.
size: number, // The size (in scale) of the rendered chip. Default is 1.
autoFit: boolean, // If true, automatically scales the chip to fit within the container element. Default is true.
enablePortHover: boolean, // If true, enables hover effects on the chip's ports to show their type and value. Default is false.
}Note
This project is not affiliated with Rec Room. It is intended for educational and informational purposes only, and should not be used for commercial applications or in violation of Rec Room's terms of service.