Script to automate a repetitive task in Animate?

[High_Tech_Made_Easy]

Hi everybody

In the past, Flash/Animate was used in our company to create illustrations (99% of which static illustrations with no animations at all). Time has come to convert these 600+ illustrations to Illustrator (Animate CC -> .svg -> Illustrator CC).

Is there a way to automate the process "publish as svg" in Animate using a script?

Thanks a lot for your ideas.

Paul

[JoãoCésar]

Hi.

Do you need to export each FLA as a SVG?

What I mean is if there is only one artwork in each FLA or it's possible that each FLA has more than one artwork in differente scenes and frames.

If you provide some more details, I can help you.

Regards,

JC

[High_Tech_Made_Easy]

Hi JC

Thanks for your quick response 🙂

Yes, I do have to export the entire repository of FLA files as SVG files (about 600 FLA in total). This is the reason why I am looking for a method to automate the task, rather than opening every single FLA manually and publishing it as SVG. What I require at the end of the day is an SVG file from each FLA file

The idea behind this is to use Illustrator CC from now on for updating the existing illustrations (former FLA files) and for creating new illustrations.

Thanks, Paul

[JoãoCésar · Accepted solution]

So here we go!

Just run the 'fla_to_svg.jsfl' script by going to 'Commands > Run Command...' or just dragging over to the Animate IDE.

Then the script will prompt you to choose the folder where the FLAs are located.

Now you just have to wait. Just pay attention that if some document asks you for missing fonts, you are going to have to dismiss the popup manually - you can check "Don't show again.".

Optionally, there is another script called 'export_publish_profile.jsfl' that you can use to change the SVG publish settings if you wish.

All you have to do is to open any FLA, go to File > Publish Settings..., configure the way you want things and then run the script to get the current settings and export to the 'fla_to_svg.xml'. Notice that in this way you can use the script to export the FLA to anything, not just SVG.

Scripts download: fla_to_svg.jslf.

'fla_to_svg.jsfl' code:

fl.outputPanel.clear();
function exportToSVG()
{
    var uri = fl.browseForFolderURL("select", "Select the folder containing the FLAs.");        
    var files = FLfile.listFolder(uri + "/*.fla", "Files.");
    var total = files.length;
    try
    {
        for (var i = 0;i < total; i++)
        {
            var profileIndex;
            fl.openDocument(uri + "/" + files);            
            profileIndex = fl.getDocumentDOM().importPublishProfile(fl.scriptURI.replace(".jsfl", ".xml"));            
            fl.getDocumentDOM().currentPublishProfile = fl.getDocumentDOM().publishProfiles[profileIndex];
            fl.getDocumentDOM().publish();
            fl.getDocumentDOM().deletePublishProfile();
            fl.getDocumentDOM().close(false);
        }
    }
    catch(error)
    {
        fl.trace(files);
        fl.trace(error);
        fl.trace("___________");
    }
}
exportToSVG();

'export_publish_profile.jsfl' code:

fl.outputPanel.clear();
function exportPublishProfile()
{
    fl.getDocumentDOM().exportPublishProfile(fl.scriptURI.replace("export_publish_profile.jsfl", "fla_to_svg.xml"));
}
exportPublishProfile();

I hope it helps and don't hesitate to ask if you have any further question.

Regards,

JC

[High_Tech_Made_Easy]

Hi JC

This looks very promising, thanks a lot. Unfortunately, I cannot download the scripts on my company computer (probably due to IT security restrictions). I will try on other computers and come back to you with the result.

Thank you and best regards

Paul

[kglad]

you can copy and paste code.

[High_Tech_Made_Easy]

Hi JC

Perfect, you made my day. This script is just awesome. It does exactly what I was looking for and the result is spot on. Thank you.

For any other users who wish to use this script, here is the procedure:

1. Open all FLA files to be converted in Animate.

2. In Animate, go to File > Publish Settings and select the required export format.

3. Run the script "export_publipsh_profile.jsfl". (There is no visible reaction from Animate here.)

4. Run the script "fla_to_svg.jsfl".

5. Select the folder where your FLA files are located. (Animate will now export the files in the selected folder.)

Thanks, Paul

[JoãoCésar]

Hey, High Tech Made Easy​!

These are excellent news! You're welcome!

I'm really glad it worked.

Regards,

JC

[High_Tech_Made_Easy]

Hi JC

I have just realized that this convertion from fla to svg messes up the fonts. According to the information of other forum members, the same happens when exporting svg from Illustrator. The reason for this behaviour is the name of the involved fonts. If they are different (e.g. the font is called "Arial-Bold" on your system but in the svg file it is referred to as "Arial Bold", the text will be exported in Times New Roman.

To overcome the problem in Illustrator, the font name in the svg file has to be identical with the font name on your system

To overcome the problem in Animate, the font must be renamed to "Arial" in the svg file. All addional info such as "Bold", Italic" or "Black" has to be deleted.

This is a bit troublesome, indeed. So if anyone has a smarter solution, you're very welcome to let us know.

Cheers, Paul

[JoãoCésar]

Hi, Paul!

Not cool...

I'm investigating a possible solution, but it's very hard to find a pattern for the fonts names.

I've been able to change the exported .svg's code to make the family names recognizable by Illustrator in most cases, but there are always some exceptions.

Animate sets the names with underscores, but Illustrator works with spaces, no spaces, and dashes.

And it gets worse when you find out that the order of the alternative names for the font matters.

For example:

Setting [FONTNAMEWITHOUTSPACES], [FONTNAMEWITHOUTSPACES]-[WEIGHT] works in most cases, but there are some font families that need to have the reverse order:  [FONTNAMEWITHOUTSPACES]-[WEIGHT], [FONTNAMEWITHOUTSPACES].

So:

"OpenSans, OpenSans-Bold" is OK. Works.

But:

"Orbitron, Orbitron-Regular" doesn't work. It has to be: "Orbitron-Regular, Orbitron".

Neo Sans Pro Medium is exported as "Neo_Sans_Pro_Medium_Regular" by Animante. But for Illustrator it becomes: "NeoSansPro-Medium, Neo Sans Pro".

My best guess is that it has to do with the font's filename and its title metadata. But it's not easy to get this info.

Anyway... I'll keep working on it and as soon as I find a solution, I'll get back to you.

Regards,

JC

[High_Tech_Made_Easy]

Hi JC

Thanks a lot!

Meantime, I did some trials and errors. I found out that the fonts in the SVGs are correct after I opened them in Illustrator and exported them as SVG again. Sound odd but it works. So my workflow is the following:

1. Open all FLA files to be converted in Animate.
2. In Animate, go to File > Publish Settings and select the required export format.
3. In Animate, go to Commands > Run Command. Run the script "export_publipsh_profile.jsfl". (There is no visible reaction from Animate here.)
4. In Animate, go to Commands > Run Command. Run the script "fla_to_svg.jsfl".
5. Select the folder where your FLA files are located. (Animate will now export the files in the selected folder.)
6. Open the SVG in Illustrator.
7. In Illustrator, go to File > Export > Export as SVG.
8. In the Export menu, set the tick “Use Artboards” and click “Export”.

Cheers, Paul

[JoãoCésar]

Hey, Paul!

This is awesome! Congrats! Very ingenious.

Now all you have left is to find a script for Illustrator to export all of your SVG files, like this one:

ESTK .jsx script to open directory of .ai files and save them as SVGs with standardised artboards (a...

Then you'll have all of your work automated.

Once again, congrats.

Regards,

JC

[BrunoPinheiro]

The code is working now, but there is a way to change the publishing profile to SVG to avoid open file by file? I have more than 10k files to convert.

[BrunoPinheiro]

Hi Joao, how are you?
I am here 5 years later with the same problem, but I am trying to use the script and after choosing the folder nothing is happening. Any idea what has changed during this time? Thank you.

[JoãoCésar]

Hi, Bruno!

It almost takes me another five years to reply! \o/

Have you solved the issue?

Please let us know.

Regards,

JC