[FlexJS] dts2as, meet as2dts (was: Release FlexJS/FalconJX 0.6.0)

[Andy Dufilie <an...@gmail.com>]

This is great - I didn't know dts2as [1] was a thing.

I recently forked as3-to-typescript [2] which uses code ported to
TypeScript from FlexPMD [3], fixed all the bugs I could find, and made it
output just definitions rather than trying to generate all the AS code in
TS syntax. After hearing about dts2as I've renamed it to as2dts and
published it on npm [4]. This means TypeScript projects can now have strong
typing information for FlexJS libraries and vice versa.

I'm using as2dts in my own project [5] because we're writing all the GUI in
TypeScript/React (which I highly recommend looking into) but using an AS
core [6] via FlexJS and it would be a nightmare to develop things without
strong typing information.

An interesting note is that TypeScript allows templating like
Array<MyClass>, so I've added a way in as2dts to support that.  It handles
comments surrounded by /*/../*/ to denote TS typings and/or template info
inline in your AS code.  For example [7][8]:

public static function getDescendants/*/<T>/*/(object:ILinkableObject,
filter:/*/new(..._:any[])=>T | string/*/Class = null):Array/*/<T &
ILinkableObject>/*/

becomes

static getDescendants<T>(object: ILinkableObject, filter?: new (..._: any[])
=> T | string): Array<T & ILinkableObject>;

TS does type inference, so if you create a variable like this (using the AS
class Weave):
var result = Weave.getDescendants(root, MyClass);
the compiler will now know that result is of type MyClass[], without having
to specify it like var result:MyClass[].

[1] https://www.npmjs.com/package/dts2as
[2] https://github.com/fdecampredon/as3-to-typescript
[3]
https://github.com/apache/flex-utilities/tree/develop/FlexPMD/flex-pmd-java/as3-parser/src/main/java/de/bokelberg/flex/parser
[4] https://github.com/WeaveTeam/as2dts
[5] https://github.com/WeaveTeam/weave-html5
[6] https://github.com/WeaveTeam/Weave/tree/develop/WeaveJS
[7]
https://github.com/WeaveTeam/Weave/blob/0c163c1/WeaveJS/src/Weave.as#L270
[8]
https://github.com/WeaveTeam/weave-html5/blob/715072d/typings/weave/weavejs.d.ts#L116

On Mon, Mar 14, 2016 at 11:19 AM, Michael Schmalle <
teotigraphixllc@gmail.com> wrote:

> On Mon, Mar 14, 2016 at 11:09 AM, Josh Tynjala <jo...@gmail.com>
> wrote:
>
> > dts2as pretty much does the same job as externc, except it uses
> TypeScript
> > definitions instead of JS externs. So yes, it probably could replace
> > externc.
> >
> > One thing to keep in mind is that dts2as requires Node.js. Everything in
> > the SDK currently uses Java, as far as I know. Requiring another runtime
> > will make it more challenging to build everything.
> >
>
> Ok, well then that meas node js needs to be installed on the build computer
> correct?
>
> It just seems to me that if this project gets more traction, using the huge
> TS definitions seems like a win and you are developing the dts2as right
> now.
>
> Oh well, just a question.
>
> Chris I know what you mean about the Java relm but when I created EXTERNC
> it was to get Alex and Peter out of handwritting js.
>
> That said, there is only "so much" that compiler can do because I hacked it
> together in about a month. Thinking about a way to create something that
> can support a yriad amount of definitions that are supported by the current
> TS community is definitely something to think about.
>
> Mike
>

Re: [FlexJS] dts2as, meet as2dts (was: Release FlexJS/FalconJX 0.6.0)

[Andy Dufilie <an...@gmail.com>]

On Tue, Mar 15, 2016 at 8:00 PM, Alex Harui <ah...@adobe.com> wrote:

>
> I just took a quick look at React.  What is it you like about it?  If it
> is the actual UI library itself, I would have to wonder what it would take
> to wrap up their UI Library so it could be used in MXML.  The JSX I saw
> seemed to have a lot of non-XML around it.
>
>
We're using TSX, which is the TypeScript version of JSX.  MXML is an XML
file format with embedded ActionScript, while TSX is more like AS files
with inline XML.  React components are classes that define a render()
function returning JSX elements which are actually used as a virtual DOM.
It compares the new elements with the old and only updates what's
necessary, so it's very efficient[1].

React does not have its own component library - you construct your own
reusable components out of basic DOM elements, though there are many
third-party components available.  No pre-existing framework satisfies all
of our needs and we require a lot of custom components, so it's a nice
fit.  Also, their philosophy matches our own, described well by a quote[2]
I found through Google:

React lets us write our UIs as a pure function of their state.
>
> This is a big, important idea.
>
> Right now we write UIs by poking at them, manually mutating their
> properties when something changes, adding and removing views, etc. This is
> fragile and error-prone. Some tools
> <https://github.com/ReactiveCocoa/ReactiveCocoa> exist to lessen the
> pain, but they can only go so far. UIs are big, messy, mutable, stateful
> bags of sadness.
>
> React let us describe our entire UI for a given state, and then it does
> the hard work of figuring out what needs to change. It abstracts all the
> fragile, error-prone code out away from us. We describe what we want,
> React figures out how to accomplish it.
>
> UIs become composable, immutable, stateless value types. React Native is
> fantastic news.
>

Finally, though a bit off topic, here's a video that got me excited about
React Native[3].  All these links are from when I first discovered React
two years ago.

[1] http://sixrevisions.com/javascript/why-i-ditched-angular-for-react/
[2] http://joshaber.github.io/2015/01/30/why-react-native-matters/
[3] https://www.youtube.com/watch?v=7rDsRXj9-cU

Re: [FlexJS] dts2as, meet as2dts (was: Release FlexJS/FalconJX 0.6.0)

[Alex Harui <ah...@adobe.com>]

On 3/15/16, 3:16 PM, "Andy Dufilie" <an...@gmail.com> wrote:

>I'm using as2dts in my own project [5] because we're writing all the GUI
>in
>TypeScript/React (which I highly recommend looking into) but using an AS
>core [6] via FlexJS and it would be a nightmare to develop things without
>strong typing information.

I just took a quick look at React.  What is it you like about it?  If it
is the actual UI library itself, I would have to wonder what it would take
to wrap up their UI Library so it could be used in MXML.  The JSX I saw
seemed to have a lot of non-XML around it.

>
>An interesting note is that TypeScript allows templating like
>Array<MyClass>, so I've added a way in as2dts to support that.  It handles
>comments surrounded by /*/../*/ to denote TS typings and/or template info
>inline in your AS code.  For example [7][8]:
>
>public static function getDescendants/*/<T>/*/(object:ILinkableObject,
>filter:/*/new(..._:any[])=>T | string/*/Class = null):Array/*/<T &
>ILinkableObject>/*/
>
>becomes
>
>static getDescendants<T>(object: ILinkableObject, filter?: new (..._:
>any[])
>=> T | string): Array<T & ILinkableObject>;
>
>TS does type inference, so if you create a variable like this (using the
>AS
>class Weave):
>var result = Weave.getDescendants(root, MyClass);
>the compiler will now know that result is of type MyClass[], without
>having
>to specify it like var result:MyClass[].

If FlexJS becomes popular, I'm sure we'll end up having to support
templates some day.  Volunteers are welcome to start now.

-Alex