Skip to content
This repository has been archived by the owner on Oct 24, 2022. It is now read-only.
/ Mysticell Public archive

A layout-agnostic, tree-based data sheet editor for the web

Notifications You must be signed in to change notification settings

AlwaysBeCrafting/Mysticell

Repository files navigation

Node editor mockup

Mysticell is currently under heavy development, and many (most) of its features are incomplete. You can see some of the working parts at http://mysticell-demo.herokuapp.com/document.example

Mysticell is designed for modern web browsers, and makes extensive use of CSS grid and flexbox. Please make sure your browser is up-to-date.

Mysticell lets you make complex data sheets by connecting parts in a graph. It's like drawing a mathematical flowchart.

While data tables are on the roadmap, that's not what Mysticell is designed for. Instead of giant grids with thousands of rows with the same kinds of data, Mysticell works best with many small bits of different kinds of data. Mysticell is mostly meant to be an RPG character sheet builder, but you're encouraged to find and share other uses!

Sheets

Sheet screenshot

Sheets are where you'll lay out and format your data. Unlike with spreadsheets, Mysticell doesn't use a cell's data as its "address". You can have as many copies of a property as you want, wherever you want, and they'll all show the correct numbers, even when you move them around or delete them.

Sheets can also be any number of rows or columns, and can be displayed side-by-side, so making lots of small groups of data is easy. Maybe you'll want to put your skills, combat stats, and inventory each on separate "cards" and stack them up next to each other.

The sidebar

Sidebar screenshot

This is the hierarchy of your document. It's where you'll find all the building blocks that go into the graphs you create. There are a few types:

  • Function icon Functions are formulas that take some input, do something to it, and give back some output as a result. They don't store any data, so you can use them in many places and get different results each time.
  • Property icon Properties are similar to functions, except that their input and output values are persistent. When you type a value into a property input, the outputs are re-calculated based on the formula inside. These inputs and outputs are the pieces you will attach to your sheets.
  • Table icon Tables aren't implemented yet, but they'll end up looking similar to the classic idea of a spreadsheet: a few headers describing each column, and lots of rows with data in them. Unlike in a spreadsheet, though, Mysticell's tables contain only static data; no formulas allowed. Instead, you plug a table into another formula and use its data there.

The graph editor

Graph editor screenshot

This is where you'll wire up all the important pieces of math that make up your document. When you open a function or property from the sidebar, this is what you'll see. Pull other cards in from the sidebar and draw wires between the nodes to edit the graph; your changes will affect the rest of the document in real time.

About

A layout-agnostic, tree-based data sheet editor for the web

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published