Standard widgets creation

Cards

Pieces

Labels

Game Boards

Legacy widgets creation

Cards

Pieces

Game Pieces

Red Orange Yellow Green Blue Purple Black White pin or dark black classic/checkers

Chess pieces

White Black

Game Boards

Tabletop Simulator importer

1. CORS prevents downloading images. You have to install (and enable for the editor) an extension for Firefox or start Chrome in a special way to disable it. I'm looking for a way around that.
2. Search for a mod in the steam workshop.
3. Use the steam workshop downloader to download it.
4. Select the file here:
5. Wait. Seriously.

Direct JSON editing

(only visible if exactly one widget is selected)

See u/RaphaelAlvez' unoffical documentation.

Macros

Preset:

Some notes

• This shit is pretty powerful but requires some coding knowledge. Ask for help in my reddit post. Also please share your code there.
• The current representation of widgets.json is available as the variable widgets.
• A card pile is 8px bigger than the cards in each dimension.

Replace packaged assets by links

The packaged assets (images inside the vtt file) will be replaced by the online version (firebasestorage.googleapis.com links) the game created.

1. Start Firefox (this does not work on Chrome).
2. Open a new playingcards.io room.
3. Press <F12> to open the dev tools and select the "Network" tab.
4. Import your VTT file into the room (and wait for it to finish).
5. Right-click somewhere in the list of network requests.
6. Select "Copy" and "Copy All As HAR".
7. Paste it into the text box below (takes a while) and press "Replace".
8. Save the VTT as an "online" version. There's no way to undo this if the links go down so save the original VTT as well. As long as the links are working, you can use the counterpart feature to download them.

Edit card decks

Card deck settings

Overlap in hand
Flip out of hand
Recall confirmation
Recall all confirmation
Enlarge

Edit cards

Here you can merge card types, move/copy card types to a new deck and add simulated card rotation.

Edit images

This operates on the selected card decks and boards.

It uses JIMP which has many editing functions. Tell me if you need one not implemented here.

Compress images

Note: all other actions keep the dimensions and convert to PNG. Use compression to turn images back to JPG.

Type: JPGPNG - Quality (JPG only):
Width:

Rotate images

Degrees:
Resize the deck/board

Crop images

X: Y:
Width: Height:
Resize the deck/board

Controls

• tooltips for the toolbar buttons show hotkeys (capital letters means press Shift)
• Drag: Move selected widgets/ Group selection
• Click: Select widget
• Shift: hold and drag to resize widgets
• Ctrl: hold while resizing to keep aspect ratio
• Shift+Arrows: move widgets by 1px
• Ctrl+Shift+Arrows: move widgets by 5px
• Escape: close all tools

Filter hotkeys:

• B: BasicWidgets
• A: Buttons
• C: Cards
• D: Decks
• P: Piles
• R: Holders
• I: Spinners
• L: Labels

Changelog

Updates

v16 - 2020-12-30

• Migrate to virtualtabletop.io

v15 - 2020-11-30

• Added support for Labels (WIP)
• Widget's labels are now called "Extra"
• New button for view options
• New button for data base
• Added quick set for Z values
• New macro for converting old SVG deck into image assets
• New macro for changing one propertie of selected widgets
• New view options:
• ⮡ Hide widgets outside of the board
• ⮡ Wide view for better view of widgets outside of the board
outside of the board
• Made the realistic preview more realistic.
• ⮡ Removed overflow of widgets
• ⮡ Realistic mode for chess pieces

v14 - 2020-10-20

• Tabletop Simulator importer: added support for card decks with unique back images.
• Tabletop Simulator importer: only importing the selected cards works now.
• Tabletop Simulator importer: selected cards of different decks can now be imported into the same deck.
• New secondary toolbars. Most features were there already but you can directly change widget IDs now.
• Copy and paste.
• "Direct coordinate editing" can now be set to use right/bottom as a reference.
• Added a new button that replaces packaged images by links.
• New macro to create a movement loop between piles.
• Made the realistic preview more realistic.

v13 - 2020-10-07

• Standard widgets can be added like in the vanilla editor thanks to u/RaphaelAlvez.
• "Edit images" can also crop images now. And the resize checkboxes work.
• "Merge card types" and "edit card deck settings" are now "edit card decks". It can also copy and split decks now and it can create card decks with rotated images.
• Added <Shift>+<Arrows> as hotkeys for moving selected widgets by 1px (5px with <Shift>+<Ctrl>).
• Added hotkeys for filtering several widget types.
• Pressing <Ctrl> while resizing keeps the aspect ratio.
• "Direct coordinate editing" can now also edit width and height.
• The changelog button is now a help button and shows hotkeys.

v12 - 2020-09-28

• "Compress images" is now "edit images". It can also rotate images now.
• Tabletop Simulator importer: all import buttons should do something now.
• Tabletop Simulator importer: back images work for simple cases.
• Tabletop Simulator importer: custom mesh textures can be imported (probably useless).
• Tabletop Simulator importer: you can set the desired height before importing.

v11 - 2020-09-27

• Integrated Tabletop Simulator importer (still WIP).
• Widgets can now also be resized with the mouse after toggling a button.
• Added hotkeys to buttons.
• Labels and recall buttons can now have a visual representation thanks to u/RaphaelAlvez.
• JSON edit can now show a compressed version of the automation button clickRoutine.
• Added a button that reselects previous widgets.
• Added a button that toggles a pretty realistic preview (most parts thanks to u/RaphaelAlvez).

v10 - 2020-09-21

• Renamed "generate widgets" to "macros" and added a lot of presets by u/RaphaelAlvez.
• Active tools are now highlighted (and there's a button to close them all).
• The filename can now be changed when saving.
• Added favicon.

v9 - 2020-09-16

• Turn all HTTP links into packaged assets.
• Merge multiple card types with the same image into one.
• Status bar with coordinates and status of some tools.
• Board images can now also be compressed.
• Widgets can now be moved with the mouse after toggling the button.
• Saving works now without loading anything prior.
• More colors for widget types (also in the filter selection).
• Several widget generation presets by u/RaphaelAlvez.

v8 - 2020-09-15

• Procedurally generate new widgets.

v7 - 2020-09-14

• Import widgets from another PCIO file.

v6 - 2020-09-14

• Undo.

v5 - 2020-09-13

• Mass compress card images.
• Remove unused card type variables and unused images.
• Set card deck options.

v4 - 2020-09-12

• Added "stripped" save and import buttons for quickly testing and changing things in the official editor without loading hundreds of card images.
• Mass set X or Y spacing.
• Direct coordinate editing now supports formulas.
• Delete widgets.
• Filter what widget types are being displayed.
• Made the editor layout responsive.

v3 - 2020-09-08

• Merge card decks.
• Cleaned it up a bit.
• Added a few descriptions and links.

v2 - 2020-09-07

• Mass offset X or Y coordinates.
• Alignment buttons.
• Direct JSON editing.
• Added a pretty awkward selection rectangle.
• Board images are now being displayed.

v1 - 2020-09-06

• Loading and saving PCIO files.
• Simple rendering and selecting of widgets.
• Mass set X or Y coordinates.