Announcing Depot

October 11, 2020 ☼ GamesTools

depot_screenshot

The work I outlined in the previous posts about building a game data editor inside of VS Code has culminated to an actual release! And it’s got a name:

depot_mark

Install Depot Now

Depot is a structured data editor for Visual Studio Code that leverages Code’s Custom Editor API to allow you to edit JSON data like a spreadsheet. Data you would normally store in raw JSON or XML can instead be stored, edited, and managed, all through a single Depot file.

Features

Quickstart

  1. Install Depot as an extension in VS Code.
  2. Once installed, use the Create a new Depot file” command to create a new Depot file in your workspace.
  3. Click on the file, create a new sheet, and start working!

You can also manually create a Depot file by creating a file with this as its contents and giving it a .dpo extension:

{
    sheets:[]
}

Note that once Depot is installed, the extension will try to open any file with .dpo through the Depot editor. If you want to manually create a Depot file, I suggest creating the file as a .txt file, adding the above contents, then changing the file’s extension to .dpo.

Custom File Extensions

You can also use a custom file extension for Depot by editing your settings.json file and adding the following line:

"workbench.editorAssociations": [
    {
        "viewType": "depot.data",
        "filenamePattern": "*.foo"
    },
    {
        "viewType": "depot.data",
        "filenamePattern": "*.bar"
    }
]

In the above example, clicking on a file with .foo or .bar would also open that file for editing in Depot.

Under the hood

A Depot file (.dpo) is just JSON, but unlike normal JSON it’s organized through Sheets, Lines, and Columns.

Sheets

At the highest level, a Depot file consists of some number of sheets. These sheets are invididual collections of structured data, with the added benefit that they can also reference each other.

Lines

A given sheet also has some number of lines. You can think of a sheet’s lines as entries in the database defined by the sheet. Lines have data based on what columns are in the sheet it is a part of.

Columns

Columns define the fields of a sheet that a line can have data for. Columns can be specific primitive types (string, bool, int, etc.), but can also be other special types unique to Depot:

Column Type Icon Description Storage Type Default Value
ID None The ID of a column. These are ideally unique, and Depot will warn you if you duplicate the value. String value index in sheet as string
GUID None A generated GUID for the given line. These cannot be edited. String value guid as string
Text Text Icon A standard line of text. String value ""
Long Text Long Text Icon Longer line of text. These fields can be resized in the editor. String Value ""
Float Float Icon Any number Number value 0
Int Int Icon Integer number Number value 0
Bool Bool Icon True / False boolean value. true or false true
Image Image Icon Path to an image relative to the location of the Depot file (displayed in the sheet) String relative path to the image ""
Single Select Single Select Icon Exclusive choice between a set number of choices String value ""
Multi Select Multi Select Icon Several choices between a set number of choices Array of selected values as string ""
Line Reference Line Reference Icon A reference to a line in a sheet in the current Depot file String GUID of selected line ""
Sheet Reference Sheet Reference Icon A reference to a sheet in the current Depot file String GUID of selected sheet ""
List List Icon An array of structured data Array of structured values []

Acknowledgements

Like I said at the start of the game data editor post, Depot would be nowhere without the work Nicholas Canasse did on CastleDB. The whole idea for an editor like this came from him, and I view the work on Depot as a continutation of that mission.

Moving Forward

Depot is also open source. If you’re interested in contributing, you could see some issues and enhancements I’ve already outlined in the github repo here:

https://github.com/kkukshtel/Depot/issues

I’m also planning on filling out the wiki on Github with more specific detail about each of Depot’s parts, and will also make a video soon outlining its features.

Lastly, thanks to everyone who read the series of posts on building the editor! Happy to bring everyone along for this ride and be able to actually release something at the end of it! You can view the previous posts in the series here:

Part 1: Why?
Part 2: Custom Editors, Webviews, and Svelte
Part 3: Getting Data into Svelte
Part 4: Editing Data in Svelte

Download Depot here:

https://marketplace.visualstudio.com/items?itemName=afterschool.depot


Back To Index