I see the problem with the duplicate folder names, should be an easy fix.

It's possible to add additional options to the configuration file, but first I would like to sort out issues in the basic use case.

Can you share the files you are trying to import? The whole folder structure, so I can try it out.

Have you tried creating the configuration file for the sprite strips? If there isn't one when a single image file is found, it will be imported as a single image. If you want a single image to be interpreted as a strip, place a configuration file next to it in the folder structure.

The file should be named c3-import-settings.json and look like this:

{
	"import-mode": "spritesheet", // set to "spritesheet" so the single image is treated as such
	
	"spritesheet": {
		"horizontal-cells": 4, // amount of horizontal slices
		"vertical-cells": 4, // amount of vertical slices
		"direction": "horizontal" // how the resulting cells will be added to the animation, either "horizontal" or "vertical"
	}
}

eleanorjmorel

It sounds like it should be possible.

If you haven't already, you should try importing some folders and zip files manually into the Animations Editor, that way you will get a feel of what the results are going to be. That will help in making clear what your application should produce.

There is a subtle difference between importing folders and zip files, which is not too difficult to understand once you try it out yourself, but when explained through text it can get confusing and might seem more complex than it actually is.

As for your problem with reading the json content, this snippet should do it

	zip.file("docData.json").async("uint8array").then(function (d) {
		const text = new TextDecoder().decode(d);
	
		// Print JSON as a raw string
		console.log(text);
		
		// Parse string into Javascript object
		const jsonObject = JSON.parse(text);
	});

As of r252 support for importing animations frames from zip files and folders has been implemented, and as is usually the case, there are a few things which are not immediately obvious about the feature. So let's talk about that.

Let's start with the basic use cases.

Basics

Importing folders

• Dragging and dropping a folder into the Animations panel, will create a new sub folder with a new animation inside of it. The animation will have frames for all images found at the root level of the folder. Both the new sub folder and the animation will have the name of the dropped folder.
• Dragging and dropping a folder into the Frames panel or the Main drawing area will add all the individual images in the folder as frames of the current animation.

Importing zip files

• Dragging and dropping a zip file into the Animations panel, will create a new animation with all images found at the root level of the zip file. The animation will have the same name as the zip file.
• Dragging and dropping a zip file into the Frames panel or the Main drawing area will add all the individual images in the zip file as frames of the current animation.

Importing from the toolbar options

The toolbar Load button now has two options. Load frames and Load animations.

• Load frames allows you to pick images to be loaded as frames of the current animation. Is is now also possible to pick zip files from the file picker. All images in a zip file will be added as frames of the current animation.
• Load animations allows you to pick images to be loaded into a new animation. Is is now also possible to pick zip files from the file picker. A new animation will be created with all of the individual images picked, while each picked zip file will correspond to a new animation being created.

Nested content

Folders and zip files which in turn also have folders and zip files inside of them are supported, depending on how you try to import these, this is how C3 will behave.

• Dropping in the Animations Panel: C3 will process everything and create animations and sub folders as needed.
• Dropping in the Frames Panel or Drawing Area: all of the nested content will be turned into a flat list and added as frames to the current animation.
• Toolbar Load Frames option: all the nested content inside a zip file will be turned into a flat list and added to the current animation.
• Toolbar Load Animations option: if a zip file with nested content is loaded, the images at the root level of the zip will be used to create an animation, if other zip files are found, new animations will be created for them. If a folder is found in a zip file, a sub folder with an animation inside of it will be created, following the same patters as importing a folder.

The key points to remember are:

• Importing folders will create a sub folder with an animation inside of it, both named after the original folder. The animation will have frames corresponding to the images found at the root level of the original folder.
• Importing zip files will create an animation named after the zip file and will have frames corresponding to all the images found at the root level of the zip file.
• If nested content is found, the same pattern applies. Each folder will correspond to a new sub folder with a new animation inside of it. Each zip file will correspond to a new animation.

Optional configuration file

Normally when importing a single file, C3 asks if the file should be treated as a sprite sheet or as a single file. In the case of importing multiple files this isn't really an option. Because of that, when importing folders or zips, even if an animation ends up having only one frame, C3 never asks how it it should be treated.

To get around this problem, a special configuration file can be added to a folder or zip file to tell C3 how it should handle the files found on them.

It's a simple JSON file, must be named c3-import-settings.json and should look like this:

{
	"import-mode": "spritesheet",
	
	"sort": "alphabetical",
	
	"order": "ascending",

	"replace-existing-animation": false,
	
	"replace-existing-folder": false,

	"use-raw-folder-names": false,

	"spritesheet": {
		"horizontal-cells": 4,
		"vertical-cells": 4,
		"direction": "horizontal"
	},
	
	"svg": {
		"width": 100,
		"height": 100
	},

	"animation": {
		"name": "optional-animation-name",
		"speed": 5,
		"loop": false,
		"repeat-count": 1,
		"repeat-to": 0,
		"ping-pong": false,
		"frame-durations": [1, 2, 3, 4],
		"frame-collision-polys": [
			{"points":[0,0,1,0,1,1,0,1]},
			{"points":[0,0,1,0,1,1,0,1]},
			{"points":[0,0,1,0,1,1,0,1]},
			{"points":[0,0,1,0,1,1,0,1]}
		],
		"frame-image-points":[
			[{"originX":0.5,"originY":0.5}, {"name":"Image Point 1","x":0.5,"y":0.5}],
			[{"originX":0.5,"originY":0.5}],
			[{"originX":0.5,"originY":0.5}],
			[{"originX":0.5,"originY":0.5}]
		],
		"frame-tags":["tag-1", "tag-2", "tag-3", "tag-4"]
	}
}

Took a look at this, and found a little problem.

If you open the .tmx in Tiled and take a look at the Tile Layer Format property in the map's main properties, it is set to Base64 (Zstandard compressed). The problem with this is that it looks like C3 is not even handling that case, so it just ignores it and doesn't do what it needs to do when it comes to the un-compression step it does when loading a map.

If you change the property to anything else, Base64 (zlib compressed) will work, and try loading in C3, then it will work.

I'm an not very familiar with Tiled so it took me a while to realize how to show the main properties, found them in Map -> Map Properties.

Anyway, that should sort you out. C3 should at least say that the compression type is not supported, should be an easy fix.

The documentation is a bit cryptic for those two shortcuts.

Looking at the code it seems that they are only for the dialogs relating to setting actions, conditions and their parameters. With those you can move back and forth the different dialogs that are presented.

The back shortcut also works in the expressions dictionary.

An additional extra caveat which I just found out, which is not documented, is that the shortcuts do not work when an input element has focus, and in the case of most of those dialogs, the search input will automatically have focus, which means the shortcuts won't work!

For that there are variants, Alt + Shift + B and Alt + Shift + N, for back and next respectively, those will have the intended effect regardless of an input element having focus.

The first step would be to document those hidden shortcuts... but I am not really sure why they are needed in the first place.