https://gist.github.com/TomByrne/785d540bbb9da22dd983bf54d904ffc9

https://gist.github.com/TomByrne/9495dba331ed8365b06abc1d9fa50d2d

Run Haxe compilation server on Windows Login

Here’s how to have the Haxe compilation server running continuously in Windows.
This speeds up autocompletion in some IDEs, and improves compilation time.

  • Open Windows Task Scheduler
  • Click Create Basic Task
  • Add name “Run Haxe Compilation Server”, or whatever
  • Add name “Run Haxe Compilation Server”, or whatever. Click Next
  • Select “When I log on”. Click Next
  • Select “Start a program”. Click Next
  • Type “haxe” in Program/script input
  • Type “-v –wait 6000” in Add arguments input. Click Next.
  • Select “Open the Properties dialog…” Click Finish
  • Select “Hidden”.
  • Select “Run whether user is logged in or not”. Click Finish

One downside to this is that (at least in FlashDevelop/HaxeDevelop) your old running debugger has to be manually killed between each debug session.

Smart Layer Export manual install

Before trying this I would recommend trying to install using the ZXP Installer tool.

Some people have trouble installing the Smart Layer Export plugin.
I don’t really recommend manually installing, as it means you won’t automatic updates.
Until Adobe fixes the plugin installer though, it’s some people’s only choice.

Here’s how to install the plugin manually.

On Mac OSX

1. Change the file extension of the plugin from zxp to zip
2. Unzip the package (the built-in unzip program doesn’t seem to work well, use Stuffit Expander instead)
3. Copy Smart Layer Export.jsx file into your Scripts folder (Applications/Adobe Illustrator CC 2014/Presets/en_US/Scripts)
3. Copy SmartLayerExport folder into your locale folder (Applications/Adobe Illustrator CC 2014/Presets/en_US)

On Windows

1. Change the file extension of the plugin from zxp to zip
2. Unzip the package
3. Copy Smart Layer Export.jsx file into your Scripts folder (C:\Program Files\Adobe\Adobe Illustrator CC 2014\Presets\en_US\Scripts)
3. Copy SmartLayerExport folder into your locale folder (C:\Program Files\Adobe\Adobe Illustrator CC 2014\Presets\en_US)

If you are using a different language, the “en_US” and “Scripts” part of those paths will be different, but it should be fairly clear which is which.

After copying the files into the correct location you will need to restart Illustrator.

On Mac the location is something like:
/Applications/Adobe Illustrator CC 2014/Presets/en_US

Managing Presets in Smart Layer Export

A user of my Smart Layer Export plugin asked me how to manage presets so I thought I’d just post some tips for everyone.

At the top left of the panel you’ll see the presets area.

Presets

1. Presets Dropdown

First is the Presets Dropdown, which loads a preset and applies it over your current settings.
A note about presets; they don’t have to include all settings, and if they omit particular settings then your current settings will remain after selecting a preset.
This allows for a preset to only affect one part of the panel (for example, only the destination folder) and leave other settings untouched.

2. Add Preset Button

The Add Preset button allows you to create a new Preset.
It will bring up the following dialog box.
AddPreset
Which allows you to name your preset, as well as select which options should be included in it (see above note about partial presets).

3. Import Preset Button

The Import Preset button brings up a file search dialog box which allows you to add exported presets to your list.

4. Export Preset Button

The Export Preset button allows you to save a preset (or the current settings) to a preset file which can then be distributed and imported on other computers.

Accessing internal Preset files

The controls provided are fairly simple and don’t allow for editing/deleting presets.
If you need to edit/delete a plugin, you currently need to access the folder where they are stored on the hard drive.

On Windows, it is here:
C:\Users\\AppData\Roaming\org.tbyrne.smartLayerExport\presets

On Mac OSX, it is here:
/Users//Library/Application Support/org.tbyrne.smartLayerExport/presets

Here you can delete presets as well as edit them in a text editer (if you know XML).

Manually installing Flash2Svg

Before trying this I would recommend trying to install using the ZXP Installer tool, this will give you access to the HTML5-based User Interface, but will still require manual updates.

If you’re having trouble installing Flash2Svg in Flash, here are some instructions to manually install the plugin.
This works in all versions (CS5 – CC 2017, as of writing) but will only give you the older, flash-based UI, not the newer HTML5-based UI.
Also note, the last version of the plugin that is compatible with CS5/CS6 is version 3.36.
This means some of the functionality won’t be there (e.g. embedding assets) but all of the most recent bug fixes will be available.

  • Download the latest ZXP
  • Change the file name of the extension from ZXP to ZIP
  • Extract the contents of the zip archive
  • Copy the SVG.swf and svg-help.xml files from the FLASH folder into this folder:
    C:\Users\{username}\AppData\Local\Adobe\Flash CS5\en_US\Configuration\WindowSWF
  • Copy the Extensible folder (also from the FLASH folder) and copy the whole folder into this folder:
    C:\Users\{username}\AppData\Local\Adobe\Flash CS5\en_US\Configuration\Javascript

Obviously change the version of flash in those paths to the correct one (e.g. ‘Flash CC 2015’).

Mac is very similar, something like:
/Users/{username}/Library/Application Support/Adobe/Flash CS5/…

On both systems you’ll probably have to show hidden folders to get there.

Haxe > Python > Remote debug on Raspberry Pi

Just got the Python remote step-through debugger working on RPi.
You can compile Haxe to Python your laptop, automatically deploy it to the RPi and then start a remote Python debug session on the device with one button.

Check out this article for the python debugger part of things:
http://www.codeproject.com/Tips/987276/Remote-Programming-of-RaspberryPi-using-PyCharm

Add an hxml file to your project called compile.hxml, in the project root:

1
2
3
-cp src
-python bin/Main.py
-main my.pack.Main

Change the details in there to match your project.

Then add a pre-launch tool to compile the Haxe code:

  • Run > Edit Configurations
  • Select your run configuration on left
  • Add a ‘Before launch’ task > “Run External Tool”
  • Add a new Tool
  • Locate the Haxe compiler in the Program field
  • Add these parameters (inc. -debug to include hx source back-references):
    1
    compile.hxml -debug
  • Set working directory to ‘$ProjectFileDir$’

Note, this Tool configuration can be reused across projects, as long as they have the compile.hxml file.

Sticking points:

  • JetBrains Haxe plugin doesn’t work well with PyCharm (ended up using FD for coding).
  • Would be awesome to get the hx source back-references integrated into the debugger so that you’re debugging Haxe not Python code.

Viber Animated SVGs

For over a year now, Viber have been funding the development of my Flash2Svg panel for Flash Professional (also available from Adobe Add-ons site).

The animations they’ve been producing with it have been really incredible, and I’ve been really keen to showcase some of their incredible work.
The resulting animations are so smooth and the vectors are so crisp that it’s really worth being able to see them at desktop size (preferably on a HiDPI/Retina screen).

So thanks to Viber for their continued support and for allowing me to some of their animations publicly.
Hopefully it’ll bring a little more attention and support to the SVG/SMIL specifications they’re built upon.

Click the images to play the animation





Flash2Svg v3.13

Recently there has been tons of activity on the Animated SVG exporter for Flash Pro.
Continue reading

Flash2Svg v3.7

There’s a new version of the Flash2Svg plugin available.

Some new features include color tweens (check the pupils in the example, from v3.7) and custom eases (1 or 2 points only, from v3.6).

Continue reading

ScreenPPI Cordova Plugin

I’ve recently released a very simple plugin for PhoneGap.
It allows access to the screen’s PPI (also called DPI).

Grab it here:
http://plugins.cordova.io/#/package/org.tbyrne.cordova.plugins.screenppi

Promises in Haxe Composure

After learning recently that Lubos Lenco was using my Composure library as the foundation of his impressive ZBlend game framework, I decided to add a few more really helpful features.

Promises

Sometimes when using @inject to inject multiple properties, it’s helpful to know when all of the properties have been injected. This can be done by adding the @promise metadata to a method with a list of the properties that should be watched for. The method will be called immediately after all properties get set.

Notice that it is possible to use non-injected variables in your promises (‘active’ in the below example). At compile-time these variables will be wrapped in getter/setters to facilitate the watching process (or the setter will be amended if it already has one).

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
    class MainPlayer extends AbstractTrait{

        public var active:Bool;

        @inject({asc:true})
        private var gamepad:IInputDevice;

        @inject
        private var controller:CharacterMotionControl;

        public function new(){
            super();
        }

        @promise("active", "gamepad", "controller")
        public function onPromiseMet(met:Bool):Void{
            if(met){
                trace("Both traits have been added and are ready to bind together");
                controller.setInput(gamepad);
            }else{
                trace("One of the traits is about to be removed, unbind them now");
                controller.setInput(null);
            }
        }
    }

How promises behave

  • The first call to your bound method will be called as soon as all applicable variables have been injected, the met parameter will always be true on the first call.
  • If any of the properties get set to another value, then the method will be called twice, once before the property is committed with met=false, then again after the value has been set with met=true. This will really only happen when promises are pointing to non-injected properties (which are set outside of the composure framework).
  • If any of the applicable traits are removed (i.e. the property is set to null) then the method will be called again with met=false

Future features

There are a few other ideas floating around for more features and improvements, which I’ll have a look at when I get a chance:

  • Compile-time binding for certain pre-established objects. This will make things much faster and lighter when generating lots of the same type of game objects (a bunch of enemies, for example).
  • A light and simple event system for communicating events between the traits of a ComposeItem. This would also come with metadata support.
  • A simpler, lighter version of the @inject metadata that trades some flexibility for performance.

SVG Animation Exporter v3.0

SVG is a great graphic format, it scales perfectly for different screen pixel densities, so that it looks crystal clear on all devices.
Being a vector format it’s also typically smaller than raster based formats (i.e. JPEG, GIF, etc)
It’s only drawback is that it consumes resources to be rendered, but this has been almost entirely mitigated in recent years by all browser vendors optimising their rendering software.
It also has the power to include animations within a single file, through the underutilised SMIL standard. These animations are also very clean and light.
Unfortunately there is little in the way of generating these animations, this is why I have been working on this export panel for flash for some time now.

Continue reading

HaxeBridges – Inter-platform coding library

HaxeBridges is a library which allows a single project to be compiled into separate parts, and for separate platforms.
This is useful for many situations, including when multi-threading, client/server, etc.

The idea is that your main application should be able to naturally use objects which will be published via a different platform/compile.

The example included in the repository now is a simple example of creating a worker thread (flash only for the moment).

In the main class:

1
2
3
4
 var obj = new ObjectInsideWorker();
 obj.nonStaticMethod(function(result){
    trace("Worker result: "+result);
 });

And the class which gets compiled into the worker:

1
2
3
4
5
6
7
8
9
10
package;
class ObjectInsideWorker{
 
 public function new(){
 }

 public function nonStaticMethod():String{
    return "nonStaticMethod: "+Std.string(Math.round(Math.random() * 1000));
 }
}

Then all that’s required is a compiler argument to get things working:

1
--macro Bridge.add('ObjectInsideWorker', 'Worker')

(first argument is a comma separated list of classes to be included in the worker)

More examples and bridge-types to come.
Check out the repository here.

RD32II Action Camera AVI file issues

I recently used a small video camera for an overseas journey and realised on return that the video files generated are formatted in such a way that prevents them from being read by most professional video editing/converting software. To get around this took a little research, so for those who are having similar issues I thought I’d post how I fixed the files. These instructions are for Windows, if anyone converts for use on OSX please post in the comments.

  • First, download ffmpeg, look for the link with “Static” in the title under the correct OS type heading (32-bit or 64-bit).
  • Open this compressed file (might need to install 7zip if you can’t immediately open the archive).
  • Extract the bin/ffmpeg.exe file from the archive and copy it into the folder with your video files.
  • Create a new text file in the same folder and add this text into it:
1
2
for %%a in ("*.*") do ffmpeg -i "%%a" -c:v libx264 -preset slow -crf 20 -c:a libvo_aacenc -b:a 128k "newfiles\%%~na.mp4"
pause
  • Rename this file “Convert.bat”.
  • Double-click this file

It will create new video files (in H264 format), after which you can delete the original AVI files.
Now you should be able to move these two files into any folder with the broken video files, run the “Convert.bat” file and it fix your videos.

If, like me, you had your camera mounted upside-down for practical purpose, then use this script instead, which will also rotate the video 180 degrees.

1
2
for %%a in ("*.*") do ffmpeg -i "%%a" -c:v libx264 -vf "vflip,hflip" -preset slow -crf 20 -c:a libvo_aacenc -b:a 128k "newfiles\%%~na.mp4"
pause

SMIL test page

Export Flash to Animated SVG

While working on a project which required rich vector animations in the browser, I came across Dave Belias’ library for exporting still SVG frames from flash. I wondered if I could re-purpose it to export Animated SVGs, a relatively unknown standard for containing fully animated imagery within a single SVG file.
Continue reading

Export Illustrator Layers to SVG files

I’m currently working on an Adobe Edge job, it’s almost totally vector based, and it turned out there were few quick options for breaking Illustrator files down into multiple SVG files.

After looking around, I decided to add features to Matthew Ericson’s awesome exporter script. Adding the SVG export format was easy enough, unfortunately I ran into another problem.

The original tool was built for raster outputs, and whilst it did support EPS, each EPS file that was generated actually had all layers included (all invisible except one).
So after some reworking I got it to generate small vector SVG/EPS files, each containing only what was needed.

I also made it easier/cleaner to add new formats and added a few usability tweaks (options which don’t apply to the current output format are disabled).

Installation & Usage

Just drop this javascript file in your Illustrator scripts folder (CS6 is something like: C:\Program Files\Adobe\Adobe Illustrator CS6\Presets\en_GB\Scripts).

In Illustrator, use the File > Scripts > MultiExporter option to bring up the dialogue box, it’s all fairly self explanatory.

MultiExporterScreen

Notes

I made minimal changes to Matt’s functionality, here are his original notes with my modifications.

  • Supported formats are: PNG8, PNG24, PDF, EPS & SVG
  • You can choose whether you want to export all the artboards in the document with the currently visible layers showing, or if you want to export files for each of the layers in a document on the currently active artboard, or if you want to export a combination of all the artboards multiplied by all the layers.
  • Files are named based on their layer name. It only exports layers where their name has been changed from the default “Layer 1″, “Layer 2″ or “Artboard 1″, “Artboard 2″, etc. I removed this feature, but might add it back as a configurable option.
  • If you put a minus sign (-) in front of a layer name or artboard name, it will skip that layer or artboard. (Useful for when you no longer decide you like a particular mockup, but don’t want to delete it from the master Illustrator document.)
  • For layers only: If you put a plus sign (+) in front of a layer name, that layer will always be visible. Useful for if you want to have a layer that always appears in the background of each exported image.
  • It stores its settings in a nonvisible, nonprinting layer named “nyt_exporter_info”

  • It has an option for transparency.
  • It has an option for embedding linked imagery (EPS & SVG only).
  • It has an option for embedding fonts (EPS only).

Check out the Gist

If the panel is unusably small

This is most likely the result of an Illustrator bug affecting Dual monitor setups.
Open the script in a text editor and replace the following line:

this.dlg = new Window('dialog', 'Multi Exporter');

with the line:

this.dlg = new Window('dialog', 'Multi Exporter', undefined, {resizeable:true});

This will make the panel resizable.
(Thanks to Alexey Tcherniak for looking into this)

Edits 11/04/2013 – 8/05/2013

There were some issues with the alignment of objects when multiple artboards existed, which I’ve fixed.
Also, it now avoids outputting imagery when nothing would be included, this makes the “Artboard + Layers” output much more useful (as you’d rarely have one layer which spans across multiple artboards).
I have added the functionality to trim the exported files to their visible size (as opposed to the artboard’s size), this will allow mouse interactions to pass around the visible area to regions behind the SVG.
Fixed an issue where layers containing only invisible items (e.g. Guides) were causing an exception.
Fixed an alignment issue which appeared if the artboard had been resized after creation.
Fixed cropping issue with large layers (and Trim option)

Edit 17/05/2013

Separated the artboard and layer selection, which now allows for more fine-grain set ups.
Now allows for ‘Trimmed Edges’ functionality for all output formats.

Edit 17/07/2013 – 28/08/2013

Now you can export Illustrator layers to FXG files (versions 1.0 & 2.0)
Added an option to ignore warnings.
Fixed ‘Save & Close’ button.
Empty child layer bug fix.

Edit 6/12/2013

Added a mode to avoid visual clipping of round backgrounds.
Thanks to John Ford for the input.

Edit 7/8/2014

I’ve changed the file naming system to be much more flexible, using a token pattern instead of the prefix/suffix fields. Try it out here.

NEW VERSION

There’s a brand new version of the tool, rewritten from the ground up, it’s way more powerful and allows for multiple image formats to be generated from a single execution.
Also, it avoids the group issue that was the cause of that annoying message box.
I’ll still be offering this version, but if you get a lot of use out of it, buying the power version would be much appreciated.

Check it out at Adobe Exchange.

Bonds Hipsters

While at the Farm, I built this site for Bonds, leading one other developer.
It connects with your Facebook account and plays a montage of your profile pics along with the Hipsters TVC.

Warner Videos

Here is a site I built during my time at the Farm, leading with another developer.
Unfortunately, we (the Farm) didn’t get the opportunity to design it as they wanted it to match a design from the States.
That said, we did use it as an opportunity to finish building visual layout and data-mapping library, which means that based on the XML data coming from the back-end, the entire site can be re-laid out.

Check it out here

© 2021 Thomas Byrne

Theme by Anders NorenUp ↑