You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@flex.apache.org by OmPrakash Muppirala <bi...@gmail.com> on 2014/09/18 00:44:28 UTC

[FlexJS] IUIBase.js has no methods

I was looking at making GraphicShape implement IUIBase.

The AS interface has a bunch of method definitions
https://github.com/apache/flex-asjs/blob/develop/frameworks/as/projects/FlexJSUI/src/org/apache/flex/core/IUIBase.as

The JS interface is looking empty
https://github.com/apache/flex-asjs/blob/develop/frameworks/js/FlexJS/src/org/apache/flex/core/IUIBase.js

Is this intentional?

Thanks,
Om

Re: [FlexJS] IUIBase.js has no methods

Posted by Alex Harui <ah...@adobe.com>.

On 9/18/14 11:34 AM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:

>On Thu, Sep 18, 2014 at 11:03 AM, Alex Harui <ah...@adobe.com> wrote:
>
>>
>>
>> On 9/18/14 10:47 AM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:
>>
>> >On Thu, Sep 18, 2014 at 9:07 AM, Alex Harui <ah...@adobe.com> wrote:
>> >
>>I guess I was expecting that you could declaratively describe a complex
>> graphic and do something like:
>>
>> <GraphicsContainer>
>>         <Rect ..>
>>         <Circle ..>
>>         <Path ..>
>> </GraphicsContainer>
>>
>>
>Right, this is essentially FXG.  I want to support this, but don't really
>want to restrict being able to add Rect to a GraphicsContainer.
In FlexJS, there can be more than one Button component.  It has a
different package, therefore MXML namespace, but the name can still be
Button.  Maybe the GraphicsContainer children are in a graphics.shapes
package and the top-level components are in a graphics.components package.
 The shapes can have an MXML namespace like "gs" and assuming
GraphicsContainer has graphics.components.Rect go in the "basic" namespace
(that I want to rename to "fjs" someday), the MXML might look like:

<fjs:ViewBase>
	<fjs:Button>
	<fjs:Rect>
	<fjs:TextInput>
	<fjs:GraphicsContainer>
		<gs:Rect>
		<gs:Circle>
		<gs:Path>
	</fjs:GraphicsContainer>
<fjs:ViewBase>
 
>>
>> What about doing something similar to Spark?  Spark has a BitmapImage
>> graphic primitive and an Image component.  FlexJS could have a Rect
>> component as well as a Rect graphic element that only can be a child of
>>a
>> GraphicsContainer.  The Rect component can just be a UIBase that is
>> composed of a GraphicsContainer child with a Rect in it.  That would be
>> consistent with the composition philosophy of FlexJS:  common patterns
>>get
>> composited into Components and can be further optimized if needed.
>>
>
>So, in this case, GraphicShape would implement IUIBase.  RectElement,
>EllipseElement, etc. would extend GraphicShape.  GraphicsContainer extends
>UIBase and would take in only GraphicShapes as children.  Is it possible
>to
>enforce this during compilation?  Or would we have to rely on runtime
>exceptions?  Or we could just add a addShape() method to GraphicsContainer
>to enforce this.  How would we suppress addElement() in that case?
I was thinking that graphics.shapes.Rect (or its base class GraphicShape)
would not implement IUIBase, maybe something new called IGraphicShape or
IGraphicElement.  I think that would make it easier to have the compiler
tell you that you cannot just drop the graphics.shape.Rect outside of a
GraphicsContainer and to tell you that you can't stick a TextInput inside
a GraphicsContainer (which is true on the JS side, isn't it?).  Yes, I
know the set of APIs is probably exactly the same, so an alternative is we
make extensions to IUIBase and use that to determine what can be a child
of what.
>
>Is that the way you see it?
I honestly don't have a particular vision.  I'm just pointing out stuff
that pops into my head while matching it up against the "composition of
smaller things" philosophy for FlexJS.

I'm still trying to finish up some significant tweaking of FlexJS to try
to get the FlexJS version of FlexStore to work.  Along the way I've made
it possible to define views in MXML and cross-compile more code instead of
having to write parallel versions. I was looking at addElement, etc and
pondering what would break if I changed the type of the child from Object
to IUIBase.  That would enforce the right children being added via AS for
these graphics primitives as well.  Then I would say that
GraphicsContainer shouldn't extend UIBase so it doesn't pick up the
addElement and have its own addElement that accepts whatever types we put
on the graphic shapes.

-Alex

Re: [FlexJS] IUIBase.js has no methods

Posted by OmPrakash Muppirala <bi...@gmail.com>.
On Thu, Sep 18, 2014 at 11:03 AM, Alex Harui <ah...@adobe.com> wrote:

>
>
> On 9/18/14 10:47 AM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:
>
> >On Thu, Sep 18, 2014 at 9:07 AM, Alex Harui <ah...@adobe.com> wrote:
> >
> >> BTW, I was thinking about this some moreŠ
> >>
> >> I haven't looked at your code, but are GraphicShapes actually allowed to
> >> be children of any container?  Or do they have to be children of a
> >> GraphicsContainer?  If the latter, then they shouldn't implement IUIBase
> >> and the developer may have to first place a GraphicsContainer in the DOM
> >> to contain them.
> >>
> >>
> >The plan is to support both.  GraphicShape is the base class for
> >individual
> >shapes like Rect, Ellipse, etc.  It is also the base class for
> >GraphicsContainer which exposes methods like drawRect, drawEllipse, etc.
> >In the former case, Rects can be directly added to a container.  In the
> >latter case, GraphicsContainer can be added to a container.
> I guess I was expecting that you could declaratively describe a complex
> graphic and do something like:
>
> <GraphicsContainer>
>         <Rect ..>
>         <Circle ..>
>         <Path ..>
> </GraphicsContainer>
>
>
Right, this is essentially FXG.  I want to support this, but don't really
want to restrict being able to add Rect to a GraphicsContainer.


> I would then think the child Rect, Circle and Path shouldn't be heavy.
> But I also see the need to have a single shape as a child of a container
> and mixed in with other components.
>

Yup, that is desirable.


>
> What about doing something similar to Spark?  Spark has a BitmapImage
> graphic primitive and an Image component.  FlexJS could have a Rect
> component as well as a Rect graphic element that only can be a child of a
> GraphicsContainer.  The Rect component can just be a UIBase that is
> composed of a GraphicsContainer child with a Rect in it.  That would be
> consistent with the composition philosophy of FlexJS:  common patterns get
> composited into Components and can be further optimized if needed.
>

So, in this case, GraphicShape would implement IUIBase.  RectElement,
EllipseElement, etc. would extend GraphicShape.  GraphicsContainer extends
UIBase and would take in only GraphicShapes as children.  Is it possible to
enforce this during compilation?  Or would we have to rely on runtime
exceptions?  Or we could just add a addShape() method to GraphicsContainer
to enforce this.  How would we suppress addElement() in that case?

Rect component extends GraphicsContainer which extends UIBase.  It would be
compose one RectElement.

Is that the way you see it?

Thanks,
Om




>
> Thoughts?
> -Alex
>
>

Re: [FlexJS] IUIBase.js has no methods

Posted by Alex Harui <ah...@adobe.com>.

On 9/18/14 10:47 AM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:

>On Thu, Sep 18, 2014 at 9:07 AM, Alex Harui <ah...@adobe.com> wrote:
>
>> BTW, I was thinking about this some moreŠ
>>
>> I haven't looked at your code, but are GraphicShapes actually allowed to
>> be children of any container?  Or do they have to be children of a
>> GraphicsContainer?  If the latter, then they shouldn't implement IUIBase
>> and the developer may have to first place a GraphicsContainer in the DOM
>> to contain them.
>>
>>
>The plan is to support both.  GraphicShape is the base class for
>individual
>shapes like Rect, Ellipse, etc.  It is also the base class for
>GraphicsContainer which exposes methods like drawRect, drawEllipse, etc.
>In the former case, Rects can be directly added to a container.  In the
>latter case, GraphicsContainer can be added to a container.
I guess I was expecting that you could declaratively describe a complex
graphic and do something like:

<GraphicsContainer>
	<Rect ..>
	<Circle ..>
	<Path ..>
</GraphicsContainer>

I would then think the child Rect, Circle and Path shouldn't be heavy.
But I also see the need to have a single shape as a child of a container
and mixed in with other components.

What about doing something similar to Spark?  Spark has a BitmapImage
graphic primitive and an Image component.  FlexJS could have a Rect
component as well as a Rect graphic element that only can be a child of a
GraphicsContainer.  The Rect component can just be a UIBase that is
composed of a GraphicsContainer child with a Rect in it.  That would be
consistent with the composition philosophy of FlexJS:  common patterns get
composited into Components and can be further optimized if needed.

Thoughts?
-Alex

Re: [FlexJS] IUIBase.js has no methods

Posted by OmPrakash Muppirala <bi...@gmail.com>.
On Thu, Sep 18, 2014 at 9:07 AM, Alex Harui <ah...@adobe.com> wrote:

> BTW, I was thinking about this some moreŠ
>
> I haven't looked at your code, but are GraphicShapes actually allowed to
> be children of any container?  Or do they have to be children of a
> GraphicsContainer?  If the latter, then they shouldn't implement IUIBase
> and the developer may have to first place a GraphicsContainer in the DOM
> to contain them.
>
>
The plan is to support both.  GraphicShape is the base class for individual
shapes like Rect, Ellipse, etc.  It is also the base class for
GraphicsContainer which exposes methods like drawRect, drawEllipse, etc.
In the former case, Rects can be directly added to a container.  In the
latter case, GraphicsContainer can be added to a container.

Thanks,
Om


> -Alex
>
> On 9/18/14 6:29 AM, "Alex Harui" <ah...@adobe.com> wrote:
>
> >
> >
> >On 9/17/14 10:50 PM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:
> >
> >>On Wed, Sep 17, 2014 at 9:58 PM, Alex Harui <ah...@adobe.com> wrote:
> >>
> >>> You sure you won't need more of IUIBase like x,y,w,h?
> >>>
> >>>
> >>On the AS side, flash.display.Shape would have those properties.  On the
> >>HTML/JS side, the x,y,w,h are part of the shape's description drawn in
> >>the
> >>parent SVG's co-ordinate space.
> >>There might be scenarios where we'll need x,y,w,h.
> >>
> >>What is the lightest implementation of IUIBase that I can use?
> >Create your own base class that extends IUIBase.
> >
> >>  I am trying
> >>to avoid extending UIBase.  Or, am I worrying too much about how heavy it
> >>is?
> >Well, UIBase is likely to be in every app.  Currently it is about 80 bytes
> >per instance on top of its base class.  On the AS side, that is Sprite.
> >The question is: is it running code you don't need?  I would think on the
> >AS-side, you don't need Sprite under the hood.
> >
> >-Alex
> >
>
>

Re: [FlexJS] IUIBase.js has no methods

Posted by Alex Harui <ah...@adobe.com>.
BTW, I was thinking about this some moreŠ

I haven't looked at your code, but are GraphicShapes actually allowed to
be children of any container?  Or do they have to be children of a
GraphicsContainer?  If the latter, then they shouldn't implement IUIBase
and the developer may have to first place a GraphicsContainer in the DOM
to contain them.

-Alex

On 9/18/14 6:29 AM, "Alex Harui" <ah...@adobe.com> wrote:

>
>
>On 9/17/14 10:50 PM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:
>
>>On Wed, Sep 17, 2014 at 9:58 PM, Alex Harui <ah...@adobe.com> wrote:
>>
>>> You sure you won't need more of IUIBase like x,y,w,h?
>>>
>>>
>>On the AS side, flash.display.Shape would have those properties.  On the
>>HTML/JS side, the x,y,w,h are part of the shape's description drawn in
>>the
>>parent SVG's co-ordinate space.
>>There might be scenarios where we'll need x,y,w,h.
>>
>>What is the lightest implementation of IUIBase that I can use?
>Create your own base class that extends IUIBase.
>
>>  I am trying
>>to avoid extending UIBase.  Or, am I worrying too much about how heavy it
>>is?
>Well, UIBase is likely to be in every app.  Currently it is about 80 bytes
>per instance on top of its base class.  On the AS side, that is Sprite.
>The question is: is it running code you don't need?  I would think on the
>AS-side, you don't need Sprite under the hood.
>
>-Alex
>

Re: [FlexJS] IUIBase.js has no methods

Posted by Alex Harui <ah...@adobe.com>.

On 9/17/14 10:50 PM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:

>On Wed, Sep 17, 2014 at 9:58 PM, Alex Harui <ah...@adobe.com> wrote:
>
>> You sure you won't need more of IUIBase like x,y,w,h?
>>
>>
>On the AS side, flash.display.Shape would have those properties.  On the
>HTML/JS side, the x,y,w,h are part of the shape's description drawn in the
>parent SVG's co-ordinate space.
>There might be scenarios where we'll need x,y,w,h.
>
>What is the lightest implementation of IUIBase that I can use?
Create your own base class that extends IUIBase.

>  I am trying
>to avoid extending UIBase.  Or, am I worrying too much about how heavy it
>is?
Well, UIBase is likely to be in every app.  Currently it is about 80 bytes
per instance on top of its base class.  On the AS side, that is Sprite.
The question is: is it running code you don't need?  I would think on the
AS-side, you don't need Sprite under the hood.

-Alex

Re: [FlexJS] IUIBase.js has no methods

Posted by OmPrakash Muppirala <bi...@gmail.com>.
On Wed, Sep 17, 2014 at 9:58 PM, Alex Harui <ah...@adobe.com> wrote:

> You sure you won't need more of IUIBase like x,y,w,h?
>
>
On the AS side, flash.display.Shape would have those properties.  On the
HTML/JS side, the x,y,w,h are part of the shape's description drawn in the
parent SVG's co-ordinate space.
There might be scenarios where we'll need x,y,w,h.

What is the lightest implementation of IUIBase that I can use?  I am trying
to avoid extending UIBase.  Or, am I worrying too much about how heavy it
is?

Thanks,
Om


> I have an Ichild locally for some other reason right now.  When I check it
> in you can add addedToParent if you need it.
>
-Alex
>
> On 9/17/14 4:54 PM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:
>
> >On Wed, Sep 17, 2014 at 4:39 PM, Alex Harui <ah...@adobe.com> wrote:
> >
> >>
> >>
> >> On 9/17/14 3:44 PM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:
> >>
> >> >I was looking at making GraphicShape implement IUIBase.
> >> >
> >> >The AS interface has a bunch of method definitions
> >> >
> >>
> >>
> https://github.com/apache/flex-asjs/blob/develop/frameworks/as/projects/F
> >>l
> >> >exJSUI/src/org/apache/flex/core/IUIBase.as
> >> >
> >> >The JS interface is looking empty
> >> >
> >>
> >>
> https://github.com/apache/flex-asjs/blob/develop/frameworks/js/FlexJS/src
> >>/
> >> >org/apache/flex/core/IUIBase.js
> >> >
> >> >Is this intentional?
> >> Yes.  No code runs in the JS or AS version and the AS version should be
> >> all that's needed for type-checking.  If Closure Compiler needs it then
> >>we
> >> can fill it in.
> >>
> >
> >I think I understand.  So, here is my scenario:  I want to keep the
> >GraphicShape object as light as possible, because I think we will have a
> >ton of those on a complex skin or chart.  I see that we need only the
> >addedToParent() method (that too only on the JS side, because I need to
> >some calculations after an element has been added to the DOM)
> >
> >I don't think it is worth extending UIBase and add all that weight to each
> >GraphicShape.  The next idea was to just implement IUIBase.
> >
> >Now I am wondering if we should create an interface for objects that only
> >need the addedToParent() method, in effect an IChild or IElement
> >interface?
> >
> >This would let me make GraphicShape extend flash.display.Shape on the AS
> >side and nothing on the JS side.  Both could just implement just the
> >IChild
> >interface.
> >
> >What do you think?
> >
> >Thanks,
> >Om
> >
> >
> >>
> >> -Alex
> >>
> >>
>
>

Re: [FlexJS] IUIBase.js has no methods

Posted by Alex Harui <ah...@adobe.com>.
You sure you won't need more of IUIBase like x,y,w,h?

I have an Ichild locally for some other reason right now.  When I check it
in you can add addedToParent if you need it.

-Alex

On 9/17/14 4:54 PM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:

>On Wed, Sep 17, 2014 at 4:39 PM, Alex Harui <ah...@adobe.com> wrote:
>
>>
>>
>> On 9/17/14 3:44 PM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:
>>
>> >I was looking at making GraphicShape implement IUIBase.
>> >
>> >The AS interface has a bunch of method definitions
>> >
>> 
>>https://github.com/apache/flex-asjs/blob/develop/frameworks/as/projects/F
>>l
>> >exJSUI/src/org/apache/flex/core/IUIBase.as
>> >
>> >The JS interface is looking empty
>> >
>> 
>>https://github.com/apache/flex-asjs/blob/develop/frameworks/js/FlexJS/src
>>/
>> >org/apache/flex/core/IUIBase.js
>> >
>> >Is this intentional?
>> Yes.  No code runs in the JS or AS version and the AS version should be
>> all that's needed for type-checking.  If Closure Compiler needs it then
>>we
>> can fill it in.
>>
>
>I think I understand.  So, here is my scenario:  I want to keep the
>GraphicShape object as light as possible, because I think we will have a
>ton of those on a complex skin or chart.  I see that we need only the
>addedToParent() method (that too only on the JS side, because I need to
>some calculations after an element has been added to the DOM)
>
>I don't think it is worth extending UIBase and add all that weight to each
>GraphicShape.  The next idea was to just implement IUIBase.
>
>Now I am wondering if we should create an interface for objects that only
>need the addedToParent() method, in effect an IChild or IElement
>interface?
>
>This would let me make GraphicShape extend flash.display.Shape on the AS
>side and nothing on the JS side.  Both could just implement just the
>IChild
>interface.
>
>What do you think?
>
>Thanks,
>Om
>
>
>>
>> -Alex
>>
>>

Re: [FlexJS] IUIBase.js has no methods

Posted by OmPrakash Muppirala <bi...@gmail.com>.
On Wed, Sep 17, 2014 at 4:39 PM, Alex Harui <ah...@adobe.com> wrote:

>
>
> On 9/17/14 3:44 PM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:
>
> >I was looking at making GraphicShape implement IUIBase.
> >
> >The AS interface has a bunch of method definitions
> >
> https://github.com/apache/flex-asjs/blob/develop/frameworks/as/projects/Fl
> >exJSUI/src/org/apache/flex/core/IUIBase.as
> >
> >The JS interface is looking empty
> >
> https://github.com/apache/flex-asjs/blob/develop/frameworks/js/FlexJS/src/
> >org/apache/flex/core/IUIBase.js
> >
> >Is this intentional?
> Yes.  No code runs in the JS or AS version and the AS version should be
> all that's needed for type-checking.  If Closure Compiler needs it then we
> can fill it in.
>

I think I understand.  So, here is my scenario:  I want to keep the
GraphicShape object as light as possible, because I think we will have a
ton of those on a complex skin or chart.  I see that we need only the
addedToParent() method (that too only on the JS side, because I need to
some calculations after an element has been added to the DOM)

I don't think it is worth extending UIBase and add all that weight to each
GraphicShape.  The next idea was to just implement IUIBase.

Now I am wondering if we should create an interface for objects that only
need the addedToParent() method, in effect an IChild or IElement interface?

This would let me make GraphicShape extend flash.display.Shape on the AS
side and nothing on the JS side.  Both could just implement just the IChild
interface.

What do you think?

Thanks,
Om


>
> -Alex
>
>

Re: [FlexJS] IUIBase.js has no methods

Posted by Alex Harui <ah...@adobe.com>.

On 9/17/14 3:44 PM, "OmPrakash Muppirala" <bi...@gmail.com> wrote:

>I was looking at making GraphicShape implement IUIBase.
>
>The AS interface has a bunch of method definitions
>https://github.com/apache/flex-asjs/blob/develop/frameworks/as/projects/Fl
>exJSUI/src/org/apache/flex/core/IUIBase.as
>
>The JS interface is looking empty
>https://github.com/apache/flex-asjs/blob/develop/frameworks/js/FlexJS/src/
>org/apache/flex/core/IUIBase.js
>
>Is this intentional?
Yes.  No code runs in the JS or AS version and the AS version should be
all that's needed for type-checking.  If Closure Compiler needs it then we
can fill it in.

-Alex