[FlexJS] Mobile Apps

[Peter Ent <pe...@adobe.com>]

Hi,

We've been working on an improved FlexJS mobile app: MobileStocks. It is in the FlexJS examples directory. This example runs on both Android and iOS devices and is a version of MobileTrader, offering just two views. The first view allows you to enter a stock symbol and a number of shares. It then puts that information into a DataGrid and a chart, monitoring the change in prices and updating the grid and chart. The second view allows you to enter a symbol and watch it in a similar fashion.  MobileStocks uses the FlexJS Storage project to retain the list of stocks between sessions.

MobileStocks uses Apache Cordova, making the app run on both iOS and Android from a single code base. Cordova integration is handled by the FlexJS Mobile project as well as the Storage project.

Building and running the app is pretty simple and you can do it from the command line or from Flash Builder. If you want to use the command line, pull down the source and run ANT to build the js-debug directory. Then run "ant -f ../../../cordova-build.xml" to create the Apache Cordova sub-project. Once that has done, connect your Android device to your computer and run "ant -f ../../../cordova-build.xml run.android" which will download a little more and then install and run the app on your device.  iOS users can do the same thing (use "run.ios") which will launch the device simulator; you also need to have Xcode installed.

You can run this example easily from Flash Builder by following the instructions on the FlexJS wiki [1] and use the launch configurations to build and run the app.

The example has shown us a couple of things.

  *   We needed to make more beads to handle different types of data providers in the pay-as-you-go world of FlexJS; this keeps the app as small as possible.
  *   We needed to add additional layouts that were more responsive to resizing.
  *   We needed to fix a couple of bugs as well.

Please give this a try if you can. The next step for the app would be some nice styling. This my "developer's eye" which is just minimal, so contribute some updates to that, if you can.

[1] https://cwiki.apache.org/confluence/pages/viewpage.action?pageId=63406558

Regards,
Peter Ent
Adobe Systems/Apache Flex Project

Re: [FlexJS] Mobile Apps

[Peter Ent <pe...@adobe.com>]

From the examples/flexjs/MobileStocks directory:

ant  (builds the bin and bin/js-debug directories)
ant -f ../../../cordova-build.xml  (builds the app/MobileStocks directory)
ant -f ../../../cordova-build.xml run.ios

The last part should bring down the Cordova file plugin and install the
iOS platform files, then run the Cordova build to generate the iOS
application and copy the files from app/MobileStocks/www into the
platform/ios area. Once built it should launch the Xcode device simulator.

Alex can clarify this, but I don't think FlexJS supports complex CSS
selectors. So something like:

#AssetsView js|DataGrid js|StringItemRenderer {
   font-size: 10px;
}

works. If it does not, perhaps we should concentrate our efforts to do
that because it would be much easier to style like this, I think, than
embedded class names.

‹peter

On 10/21/16, 12:12 PM, "carlos.rovira@gmail.com on behalf of Carlos
Rovira" <carlos.rovira@gmail.com on behalf of
carlos.rovira@codeoscopic.com> wrote:

>Hi Peter,
>
>congrats for reaching the milestone. I'm trying but finding some problems:
>
>(Prerequisites: I'm on Mac and want to try iOS version, I already has
>Xcode
>installed. I don't have FB anymore. I installed Cordova vía NPM...all ok)
>
>*I run from MobileStocks folder, but ant told me that there's no
>bin/je-debug folder. Checking wiki url you gave I created manually
>bin/debug. finaly I get ANT BUILD SUCCESSFUL (maybe ant should create bin
>and js-debug folders?)
>
>* Then for your instructions I use "run.ios"...this is a file (I don't
>find
>any). I'm stuck there.
>
>For getting styling you mention, there's 2 approach, one to use what we
>have and try to style ( I think this is limited), the second is use some
>good library out there like MDL, BootStrap, or others. I'm on the works as
>you already know with MDL. Right now I'm doing components in the "mdl"
>namespace, but this is not the ideal scenario, since it would be great to
>get a MDL style in a js:Button without the need to change it to
>mdl:Button,
>only applying styles.
>
>I'm finding some more few things:
>
>* CSS styles already in place are very cumbersome and I think we would
>need
>to work on a clean separation to avoid mixing and generating side effect.
>Alex propose in other thread some compiler options to avoid include
>CSS...maybe this is a nice option.
>* classNames and typeNames are part of the problems, but only due to the
>before mentioned point. If we can compile without already set styles this
>could solve the problem.
>* With MDL I'm inserting classNames inside class components, what I don't
>like since is a clear mixing of AS3 code declaration with CSS styles.
>* from the experience I'm getting with MDL (and suppose that other
>libraries like bootstrap will be the same), those good looking styles are
>dependent from a concrete way of implementing the html tags and use of
>html
>class. Maybe a component need to create a surrounding div and then nest a
>span, and this maybe is not what our HTML implementation does. I think a
>right approach should be to use the HTML swc and be able to change the
>output to match what a concrete style demands.
>
>For example, I'm making a Card component (and btw learning how flexjs
>framework works):
>https://getmdl.io/components/#cards-section
>
>This could be some kind of a Panel...but is not a Panel, so better create
>a
>Card component, but if you see the structure, is completely made to use
>the
>MDL style...
>
>looking at the MobileStocks code, it seems, the approach is the first one,
>since is all made with FlexJS comps. In that scenario, I think we need as
>well a way to not be bloated with CSS styles that we don't know where came
>from. and start from a clean state.
>
>I think this is something like a prerequisite in order to be able to work
>in some kind of styling.
>
>Hope I could first build MobileStocks and try on my iPhone to get a look
>at
>what we are talking about.
>
>Thanks
>
>Carlos
>
>
>
>
>2016-10-21 15:53 GMT+02:00 Peter Ent <pe...@adobe.com>:
>
>> Hi,
>>
>> We've been working on an improved FlexJS mobile app: MobileStocks. It is
>> in the FlexJS examples directory. This example runs on both Android and
>>iOS
>> devices and is a version of MobileTrader, offering just two views. The
>> first view allows you to enter a stock symbol and a number of shares. It
>> then puts that information into a DataGrid and a chart, monitoring the
>> change in prices and updating the grid and chart. The second view allows
>> you to enter a symbol and watch it in a similar fashion.  MobileStocks
>>uses
>> the FlexJS Storage project to retain the list of stocks between
>>sessions.
>>
>> MobileStocks uses Apache Cordova, making the app run on both iOS and
>> Android from a single code base. Cordova integration is handled by the
>> FlexJS Mobile project as well as the Storage project.
>>
>> Building and running the app is pretty simple and you can do it from the
>> command line or from Flash Builder. If you want to use the command line,
>> pull down the source and run ANT to build the js-debug directory. Then
>>run
>> "ant -f ../../../cordova-build.xml" to create the Apache Cordova
>> sub-project. Once that has done, connect your Android device to your
>> computer and run "ant -f ../../../cordova-build.xml run.android" which
>>will
>> download a little more and then install and run the app on your device.
>> iOS users can do the same thing (use "run.ios") which will launch the
>> device simulator; you also need to have Xcode installed.
>>
>> You can run this example easily from Flash Builder by following the
>> instructions on the FlexJS wiki [1] and use the launch configurations to
>> build and run the app.
>>
>> The example has shown us a couple of things.
>>
>>   *   We needed to make more beads to handle different types of data
>> providers in the pay-as-you-go world of FlexJS; this keeps the app as
>>small
>> as possible.
>>   *   We needed to add additional layouts that were more responsive to
>> resizing.
>>   *   We needed to fix a couple of bugs as well.
>>
>> Please give this a try if you can. The next step for the app would be
>>some
>> nice styling. This my "developer's eye" which is just minimal, so
>> contribute some updates to that, if you can.
>>
>> [1] https://cwiki.apache.org/confluence/pages/viewpage.
>> action?pageId=63406558
>>
>> Regards,
>> Peter Ent
>> Adobe Systems/Apache Flex Project
>>
>
>
>
>-- 
>
>Carlos Rovira
>Director General
>M: +34 607 22 60 05
>http://www.codeoscopic.com
>http://www.avant2.es
>
>
>Este mensaje se dirige exclusivamente a su destinatario y puede contener
>información privilegiada o confidencial. Si ha recibido este mensaje por
>error, le rogamos que nos lo comunique inmediatamente por esta misma vía y
>proceda a su destrucción.
>
>De la vigente Ley Orgánica de Protección de Datos (15/1999), le
>comunicamos
>que sus datos forman parte de un fichero cuyo responsable es CODEOSCOPIC
>S.A. La finalidad de dicho tratamiento es facilitar la prestación del
>servicio o información solicitados, teniendo usted derecho de acceso,
>rectificación, cancelación y oposición de sus datos dirigiéndose a
>nuestras
>oficinas c/ Paseo de la Habana 9-11, 28036, Madrid con la documentación
>necesaria.

Re: [FlexJS] Mobile Apps

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

We could probably make cordova-build.xml work with Maven output in the
target folder instead of bin-debug.  But yes, I don't think Peter or I
understand how to use Maven with Cordova, so the last piece will still
require Ant until some other volunteer steps up.

-Alex

On 10/21/16, 11:00 AM, "Peter Ent" <pe...@adobe.com> wrote:

>I used maven on a very complex project a number of years ago and don't
>really remember much about it. I can try to piece together a pom file
>using another example, but I would have no idea how to do something like
>the cordova-build.xml file.
>
>‹peter
>
>On 10/21/16, 12:16 PM, "carlos.rovira@gmail.com on behalf of Carlos
>Rovira" <carlos.rovira@gmail.com on behalf of
>carlos.rovira@codeoscopic.com> wrote:
>
>>One final note, I'm building all with maven. I didn't try maven as you
>>posted ANT build instructions.
>>Are maven pom configured to work. It would be very handy
>>thanks!
>>
>>2016-10-21 18:12 GMT+02:00 Carlos Rovira <ca...@codeoscopic.com>:
>>
>>> Hi Peter,
>>>
>>> congrats for reaching the milestone. I'm trying but finding some
>>>problems:
>>>
>>> (Prerequisites: I'm on Mac and want to try iOS version, I already has
>>> Xcode installed. I don't have FB anymore. I installed Cordova vía
>>>NPM...all
>>> ok)
>>>
>>> *I run from MobileStocks folder, but ant told me that there's no
>>> bin/je-debug folder. Checking wiki url you gave I created manually
>>> bin/debug. finaly I get ANT BUILD SUCCESSFUL (maybe ant should create
>>>bin
>>> and js-debug folders?)
>>>
>>> * Then for your instructions I use "run.ios"...this is a file (I don't
>>> find any). I'm stuck there.
>>>
>>> For getting styling you mention, there's 2 approach, one to use what we
>>> have and try to style ( I think this is limited), the second is use
>>>some
>>> good library out there like MDL, BootStrap, or others. I'm on the works
>>>as
>>> you already know with MDL. Right now I'm doing components in the "mdl"
>>> namespace, but this is not the ideal scenario, since it would be great
>>>to
>>> get a MDL style in a js:Button without the need to change it to
>>>mdl:Button,
>>> only applying styles.
>>>
>>> I'm finding some more few things:
>>>
>>> * CSS styles already in place are very cumbersome and I think we would
>>> need to work on a clean separation to avoid mixing and generating side
>>> effect. Alex propose in other thread some compiler options to avoid
>>>include
>>> CSS...maybe this is a nice option.
>>> * classNames and typeNames are part of the problems, but only due to
>>>the
>>> before mentioned point. If we can compile without already set styles
>>>this
>>> could solve the problem.
>>> * With MDL I'm inserting classNames inside class components, what I
>>>don't
>>> like since is a clear mixing of AS3 code declaration with CSS styles.
>>> * from the experience I'm getting with MDL (and suppose that other
>>> libraries like bootstrap will be the same), those good looking styles
>>>are
>>> dependent from a concrete way of implementing the html tags and use of
>>>html
>>> class. Maybe a component need to create a surrounding div and then nest
>>>a
>>> span, and this maybe is not what our HTML implementation does. I think
>>>a
>>> right approach should be to use the HTML swc and be able to change the
>>> output to match what a concrete style demands.
>>>
>>> For example, I'm making a Card component (and btw learning how flexjs
>>> framework works):
>>> https://getmdl.io/components/#cards-section
>>>
>>> This could be some kind of a Panel...but is not a Panel, so better
>>>create
>>> a Card component, but if you see the structure, is completely made to
>>>use
>>> the MDL style...
>>>
>>> looking at the MobileStocks code, it seems, the approach is the first
>>>one,
>>> since is all made with FlexJS comps. In that scenario, I think we need
>>>as
>>> well a way to not be bloated with CSS styles that we don't know where
>>>came
>>> from. and start from a clean state.
>>>
>>> I think this is something like a prerequisite in order to be able to
>>>work
>>> in some kind of styling.
>>>
>>> Hope I could first build MobileStocks and try on my iPhone to get a
>>>look
>>> at what we are talking about.
>>>
>>> Thanks
>>>
>>> Carlos
>>>
>>>
>>>
>>>
>>> 2016-10-21 15:53 GMT+02:00 Peter Ent <pe...@adobe.com>:
>>>
>>>> Hi,
>>>>
>>>> We've been working on an improved FlexJS mobile app: MobileStocks. It
>>>>is
>>>> in the FlexJS examples directory. This example runs on both Android
>>>>and iOS
>>>> devices and is a version of MobileTrader, offering just two views. The
>>>> first view allows you to enter a stock symbol and a number of shares.
>>>>It
>>>> then puts that information into a DataGrid and a chart, monitoring the
>>>> change in prices and updating the grid and chart. The second view
>>>>allows
>>>> you to enter a symbol and watch it in a similar fashion.  MobileStocks
>>>>uses
>>>> the FlexJS Storage project to retain the list of stocks between
>>>>sessions.
>>>>
>>>> MobileStocks uses Apache Cordova, making the app run on both iOS and
>>>> Android from a single code base. Cordova integration is handled by the
>>>> FlexJS Mobile project as well as the Storage project.
>>>>
>>>> Building and running the app is pretty simple and you can do it from
>>>>the
>>>> command line or from Flash Builder. If you want to use the command
>>>>line,
>>>> pull down the source and run ANT to build the js-debug directory. Then
>>>>run
>>>> "ant -f ../../../cordova-build.xml" to create the Apache Cordova
>>>> sub-project. Once that has done, connect your Android device to your
>>>> computer and run "ant -f ../../../cordova-build.xml run.android" which
>>>>will
>>>> download a little more and then install and run the app on your
>>>>device.
>>>> iOS users can do the same thing (use "run.ios") which will launch the
>>>> device simulator; you also need to have Xcode installed.
>>>>
>>>> You can run this example easily from Flash Builder by following the
>>>> instructions on the FlexJS wiki [1] and use the launch configurations
>>>>to
>>>> build and run the app.
>>>>
>>>> The example has shown us a couple of things.
>>>>
>>>>   *   We needed to make more beads to handle different types of data
>>>> providers in the pay-as-you-go world of FlexJS; this keeps the app as
>>>>small
>>>> as possible.
>>>>   *   We needed to add additional layouts that were more responsive to
>>>> resizing.
>>>>   *   We needed to fix a couple of bugs as well.
>>>>
>>>> Please give this a try if you can. The next step for the app would be
>>>> some nice styling. This my "developer's eye" which is just minimal, so
>>>> contribute some updates to that, if you can.
>>>>
>>>> [1] https://cwiki.apache.org/confluence/pages/viewpage.action?
>>>> pageId=63406558
>>>>
>>>> Regards,
>>>> Peter Ent
>>>> Adobe Systems/Apache Flex Project
>>>>
>>>
>>>
>>>
>>> --
>>>
>>> Carlos Rovira
>>> Director General
>>> M: +34 607 22 60 05
>>> http://www.codeoscopic.com
>>> http://www.avant2.es
>>>
>>>
>>> Este mensaje se dirige exclusivamente a su destinatario y puede
>>>contener
>>> información privilegiada o confidencial. Si ha recibido este mensaje
>>>por
>>> error, le rogamos que nos lo comunique inmediatamente por esta misma
>>>vía y
>>> proceda a su destrucción.
>>>
>>> De la vigente Ley Orgánica de Protección de Datos (15/1999), le
>>> comunicamos que sus datos forman parte de un fichero cuyo responsable
>>>es
>>> CODEOSCOPIC S.A. La finalidad de dicho tratamiento es facilitar la
>>> prestación del servicio o información solicitados, teniendo usted
>>>derecho
>>> de acceso, rectificación, cancelación y oposición de sus datos
>>>dirigiéndose
>>> a nuestras oficinas c/ Paseo de la Habana 9-11, 28036, Madrid con la
>>> documentación necesaria.
>>>
>>>
>>
>>
>>-- 
>>
>>Carlos Rovira
>>Director General
>>M: +34 607 22 60 05
>>http://www.codeoscopic.com
>>http://www.avant2.es
>>
>>
>>Este mensaje se dirige exclusivamente a su destinatario y puede contener
>>información privilegiada o confidencial. Si ha recibido este mensaje por
>>error, le rogamos que nos lo comunique inmediatamente por esta misma vía
>>y
>>proceda a su destrucción.
>>
>>De la vigente Ley Orgánica de Protección de Datos (15/1999), le
>>comunicamos
>>que sus datos forman parte de un fichero cuyo responsable es CODEOSCOPIC
>>S.A. La finalidad de dicho tratamiento es facilitar la prestación del
>>servicio o información solicitados, teniendo usted derecho de acceso,
>>rectificación, cancelación y oposición de sus datos dirigiéndose a
>>nuestras
>>oficinas c/ Paseo de la Habana 9-11, 28036, Madrid con la documentación
>>necesaria.
>

Re: [FlexJS] Mobile Apps

[Peter Ent <pe...@adobe.com>]

I used maven on a very complex project a number of years ago and don't
really remember much about it. I can try to piece together a pom file
using another example, but I would have no idea how to do something like
the cordova-build.xml file.

‹peter

On 10/21/16, 12:16 PM, "carlos.rovira@gmail.com on behalf of Carlos
Rovira" <carlos.rovira@gmail.com on behalf of
carlos.rovira@codeoscopic.com> wrote:

>One final note, I'm building all with maven. I didn't try maven as you
>posted ANT build instructions.
>Are maven pom configured to work. It would be very handy
>thanks!
>
>2016-10-21 18:12 GMT+02:00 Carlos Rovira <ca...@codeoscopic.com>:
>
>> Hi Peter,
>>
>> congrats for reaching the milestone. I'm trying but finding some
>>problems:
>>
>> (Prerequisites: I'm on Mac and want to try iOS version, I already has
>> Xcode installed. I don't have FB anymore. I installed Cordova vía
>>NPM...all
>> ok)
>>
>> *I run from MobileStocks folder, but ant told me that there's no
>> bin/je-debug folder. Checking wiki url you gave I created manually
>> bin/debug. finaly I get ANT BUILD SUCCESSFUL (maybe ant should create
>>bin
>> and js-debug folders?)
>>
>> * Then for your instructions I use "run.ios"...this is a file (I don't
>> find any). I'm stuck there.
>>
>> For getting styling you mention, there's 2 approach, one to use what we
>> have and try to style ( I think this is limited), the second is use some
>> good library out there like MDL, BootStrap, or others. I'm on the works
>>as
>> you already know with MDL. Right now I'm doing components in the "mdl"
>> namespace, but this is not the ideal scenario, since it would be great
>>to
>> get a MDL style in a js:Button without the need to change it to
>>mdl:Button,
>> only applying styles.
>>
>> I'm finding some more few things:
>>
>> * CSS styles already in place are very cumbersome and I think we would
>> need to work on a clean separation to avoid mixing and generating side
>> effect. Alex propose in other thread some compiler options to avoid
>>include
>> CSS...maybe this is a nice option.
>> * classNames and typeNames are part of the problems, but only due to the
>> before mentioned point. If we can compile without already set styles
>>this
>> could solve the problem.
>> * With MDL I'm inserting classNames inside class components, what I
>>don't
>> like since is a clear mixing of AS3 code declaration with CSS styles.
>> * from the experience I'm getting with MDL (and suppose that other
>> libraries like bootstrap will be the same), those good looking styles
>>are
>> dependent from a concrete way of implementing the html tags and use of
>>html
>> class. Maybe a component need to create a surrounding div and then nest
>>a
>> span, and this maybe is not what our HTML implementation does. I think a
>> right approach should be to use the HTML swc and be able to change the
>> output to match what a concrete style demands.
>>
>> For example, I'm making a Card component (and btw learning how flexjs
>> framework works):
>> https://getmdl.io/components/#cards-section
>>
>> This could be some kind of a Panel...but is not a Panel, so better
>>create
>> a Card component, but if you see the structure, is completely made to
>>use
>> the MDL style...
>>
>> looking at the MobileStocks code, it seems, the approach is the first
>>one,
>> since is all made with FlexJS comps. In that scenario, I think we need
>>as
>> well a way to not be bloated with CSS styles that we don't know where
>>came
>> from. and start from a clean state.
>>
>> I think this is something like a prerequisite in order to be able to
>>work
>> in some kind of styling.
>>
>> Hope I could first build MobileStocks and try on my iPhone to get a look
>> at what we are talking about.
>>
>> Thanks
>>
>> Carlos
>>
>>
>>
>>
>> 2016-10-21 15:53 GMT+02:00 Peter Ent <pe...@adobe.com>:
>>
>>> Hi,
>>>
>>> We've been working on an improved FlexJS mobile app: MobileStocks. It
>>>is
>>> in the FlexJS examples directory. This example runs on both Android
>>>and iOS
>>> devices and is a version of MobileTrader, offering just two views. The
>>> first view allows you to enter a stock symbol and a number of shares.
>>>It
>>> then puts that information into a DataGrid and a chart, monitoring the
>>> change in prices and updating the grid and chart. The second view
>>>allows
>>> you to enter a symbol and watch it in a similar fashion.  MobileStocks
>>>uses
>>> the FlexJS Storage project to retain the list of stocks between
>>>sessions.
>>>
>>> MobileStocks uses Apache Cordova, making the app run on both iOS and
>>> Android from a single code base. Cordova integration is handled by the
>>> FlexJS Mobile project as well as the Storage project.
>>>
>>> Building and running the app is pretty simple and you can do it from
>>>the
>>> command line or from Flash Builder. If you want to use the command
>>>line,
>>> pull down the source and run ANT to build the js-debug directory. Then
>>>run
>>> "ant -f ../../../cordova-build.xml" to create the Apache Cordova
>>> sub-project. Once that has done, connect your Android device to your
>>> computer and run "ant -f ../../../cordova-build.xml run.android" which
>>>will
>>> download a little more and then install and run the app on your device.
>>> iOS users can do the same thing (use "run.ios") which will launch the
>>> device simulator; you also need to have Xcode installed.
>>>
>>> You can run this example easily from Flash Builder by following the
>>> instructions on the FlexJS wiki [1] and use the launch configurations
>>>to
>>> build and run the app.
>>>
>>> The example has shown us a couple of things.
>>>
>>>   *   We needed to make more beads to handle different types of data
>>> providers in the pay-as-you-go world of FlexJS; this keeps the app as
>>>small
>>> as possible.
>>>   *   We needed to add additional layouts that were more responsive to
>>> resizing.
>>>   *   We needed to fix a couple of bugs as well.
>>>
>>> Please give this a try if you can. The next step for the app would be
>>> some nice styling. This my "developer's eye" which is just minimal, so
>>> contribute some updates to that, if you can.
>>>
>>> [1] https://cwiki.apache.org/confluence/pages/viewpage.action?
>>> pageId=63406558
>>>
>>> Regards,
>>> Peter Ent
>>> Adobe Systems/Apache Flex Project
>>>
>>
>>
>>
>> --
>>
>> Carlos Rovira
>> Director General
>> M: +34 607 22 60 05
>> http://www.codeoscopic.com
>> http://www.avant2.es
>>
>>
>> Este mensaje se dirige exclusivamente a su destinatario y puede contener
>> información privilegiada o confidencial. Si ha recibido este mensaje por
>> error, le rogamos que nos lo comunique inmediatamente por esta misma
>>vía y
>> proceda a su destrucción.
>>
>> De la vigente Ley Orgánica de Protección de Datos (15/1999), le
>> comunicamos que sus datos forman parte de un fichero cuyo responsable es
>> CODEOSCOPIC S.A. La finalidad de dicho tratamiento es facilitar la
>> prestación del servicio o información solicitados, teniendo usted
>>derecho
>> de acceso, rectificación, cancelación y oposición de sus datos
>>dirigiéndose
>> a nuestras oficinas c/ Paseo de la Habana 9-11, 28036, Madrid con la
>> documentación necesaria.
>>
>>
>
>
>-- 
>
>Carlos Rovira
>Director General
>M: +34 607 22 60 05
>http://www.codeoscopic.com
>http://www.avant2.es
>
>
>Este mensaje se dirige exclusivamente a su destinatario y puede contener
>información privilegiada o confidencial. Si ha recibido este mensaje por
>error, le rogamos que nos lo comunique inmediatamente por esta misma vía y
>proceda a su destrucción.
>
>De la vigente Ley Orgánica de Protección de Datos (15/1999), le
>comunicamos
>que sus datos forman parte de un fichero cuyo responsable es CODEOSCOPIC
>S.A. La finalidad de dicho tratamiento es facilitar la prestación del
>servicio o información solicitados, teniendo usted derecho de acceso,
>rectificación, cancelación y oposición de sus datos dirigiéndose a
>nuestras
>oficinas c/ Paseo de la Habana 9-11, 28036, Madrid con la documentación
>necesaria.

Re: [FlexJS] Mobile Apps

[Carlos Rovira <ca...@codeoscopic.com>]

One final note, I'm building all with maven. I didn't try maven as you
posted ANT build instructions.
Are maven pom configured to work. It would be very handy
thanks!

2016-10-21 18:12 GMT+02:00 Carlos Rovira <ca...@codeoscopic.com>:

> Hi Peter,
>
> congrats for reaching the milestone. I'm trying but finding some problems:
>
> (Prerequisites: I'm on Mac and want to try iOS version, I already has
> Xcode installed. I don't have FB anymore. I installed Cordova vía NPM...all
> ok)
>
> *I run from MobileStocks folder, but ant told me that there's no
> bin/je-debug folder. Checking wiki url you gave I created manually
> bin/debug. finaly I get ANT BUILD SUCCESSFUL (maybe ant should create bin
> and js-debug folders?)
>
> * Then for your instructions I use "run.ios"...this is a file (I don't
> find any). I'm stuck there.
>
> For getting styling you mention, there's 2 approach, one to use what we
> have and try to style ( I think this is limited), the second is use some
> good library out there like MDL, BootStrap, or others. I'm on the works as
> you already know with MDL. Right now I'm doing components in the "mdl"
> namespace, but this is not the ideal scenario, since it would be great to
> get a MDL style in a js:Button without the need to change it to mdl:Button,
> only applying styles.
>
> I'm finding some more few things:
>
> * CSS styles already in place are very cumbersome and I think we would
> need to work on a clean separation to avoid mixing and generating side
> effect. Alex propose in other thread some compiler options to avoid include
> CSS...maybe this is a nice option.
> * classNames and typeNames are part of the problems, but only due to the
> before mentioned point. If we can compile without already set styles this
> could solve the problem.
> * With MDL I'm inserting classNames inside class components, what I don't
> like since is a clear mixing of AS3 code declaration with CSS styles.
> * from the experience I'm getting with MDL (and suppose that other
> libraries like bootstrap will be the same), those good looking styles are
> dependent from a concrete way of implementing the html tags and use of html
> class. Maybe a component need to create a surrounding div and then nest a
> span, and this maybe is not what our HTML implementation does. I think a
> right approach should be to use the HTML swc and be able to change the
> output to match what a concrete style demands.
>
> For example, I'm making a Card component (and btw learning how flexjs
> framework works):
> https://getmdl.io/components/#cards-section
>
> This could be some kind of a Panel...but is not a Panel, so better create
> a Card component, but if you see the structure, is completely made to use
> the MDL style...
>
> looking at the MobileStocks code, it seems, the approach is the first one,
> since is all made with FlexJS comps. In that scenario, I think we need as
> well a way to not be bloated with CSS styles that we don't know where came
> from. and start from a clean state.
>
> I think this is something like a prerequisite in order to be able to work
> in some kind of styling.
>
> Hope I could first build MobileStocks and try on my iPhone to get a look
> at what we are talking about.
>
> Thanks
>
> Carlos
>
>
>
>
> 2016-10-21 15:53 GMT+02:00 Peter Ent <pe...@adobe.com>:
>
>> Hi,
>>
>> We've been working on an improved FlexJS mobile app: MobileStocks. It is
>> in the FlexJS examples directory. This example runs on both Android and iOS
>> devices and is a version of MobileTrader, offering just two views. The
>> first view allows you to enter a stock symbol and a number of shares. It
>> then puts that information into a DataGrid and a chart, monitoring the
>> change in prices and updating the grid and chart. The second view allows
>> you to enter a symbol and watch it in a similar fashion.  MobileStocks uses
>> the FlexJS Storage project to retain the list of stocks between sessions.
>>
>> MobileStocks uses Apache Cordova, making the app run on both iOS and
>> Android from a single code base. Cordova integration is handled by the
>> FlexJS Mobile project as well as the Storage project.
>>
>> Building and running the app is pretty simple and you can do it from the
>> command line or from Flash Builder. If you want to use the command line,
>> pull down the source and run ANT to build the js-debug directory. Then run
>> "ant -f ../../../cordova-build.xml" to create the Apache Cordova
>> sub-project. Once that has done, connect your Android device to your
>> computer and run "ant -f ../../../cordova-build.xml run.android" which will
>> download a little more and then install and run the app on your device.
>> iOS users can do the same thing (use "run.ios") which will launch the
>> device simulator; you also need to have Xcode installed.
>>
>> You can run this example easily from Flash Builder by following the
>> instructions on the FlexJS wiki [1] and use the launch configurations to
>> build and run the app.
>>
>> The example has shown us a couple of things.
>>
>>   *   We needed to make more beads to handle different types of data
>> providers in the pay-as-you-go world of FlexJS; this keeps the app as small
>> as possible.
>>   *   We needed to add additional layouts that were more responsive to
>> resizing.
>>   *   We needed to fix a couple of bugs as well.
>>
>> Please give this a try if you can. The next step for the app would be
>> some nice styling. This my "developer's eye" which is just minimal, so
>> contribute some updates to that, if you can.
>>
>> [1] https://cwiki.apache.org/confluence/pages/viewpage.action?
>> pageId=63406558
>>
>> Regards,
>> Peter Ent
>> Adobe Systems/Apache Flex Project
>>
>
>
>
> --
>
> Carlos Rovira
> Director General
> M: +34 607 22 60 05
> http://www.codeoscopic.com
> http://www.avant2.es
>
>
> Este mensaje se dirige exclusivamente a su destinatario y puede contener
> información privilegiada o confidencial. Si ha recibido este mensaje por
> error, le rogamos que nos lo comunique inmediatamente por esta misma vía y
> proceda a su destrucción.
>
> De la vigente Ley Orgánica de Protección de Datos (15/1999), le
> comunicamos que sus datos forman parte de un fichero cuyo responsable es
> CODEOSCOPIC S.A. La finalidad de dicho tratamiento es facilitar la
> prestación del servicio o información solicitados, teniendo usted derecho
> de acceso, rectificación, cancelación y oposición de sus datos dirigiéndose
> a nuestras oficinas c/ Paseo de la Habana 9-11, 28036, Madrid con la
> documentación necesaria.
>
>


-- 

Carlos Rovira
Director General
M: +34 607 22 60 05
http://www.codeoscopic.com
http://www.avant2.es


Este mensaje se dirige exclusivamente a su destinatario y puede contener
información privilegiada o confidencial. Si ha recibido este mensaje por
error, le rogamos que nos lo comunique inmediatamente por esta misma vía y
proceda a su destrucción.

De la vigente Ley Orgánica de Protección de Datos (15/1999), le comunicamos
que sus datos forman parte de un fichero cuyo responsable es CODEOSCOPIC
S.A. La finalidad de dicho tratamiento es facilitar la prestación del
servicio o información solicitados, teniendo usted derecho de acceso,
rectificación, cancelación y oposición de sus datos dirigiéndose a nuestras
oficinas c/ Paseo de la Habana 9-11, 28036, Madrid con la documentación
necesaria.

Re: [FlexJS] Mobile Apps

[Carlos Rovira <ca...@codeoscopic.com>]

Hi Peter,

congrats for reaching the milestone. I'm trying but finding some problems:

(Prerequisites: I'm on Mac and want to try iOS version, I already has Xcode
installed. I don't have FB anymore. I installed Cordova vía NPM...all ok)

*I run from MobileStocks folder, but ant told me that there's no
bin/je-debug folder. Checking wiki url you gave I created manually
bin/debug. finaly I get ANT BUILD SUCCESSFUL (maybe ant should create bin
and js-debug folders?)

* Then for your instructions I use "run.ios"...this is a file (I don't find
any). I'm stuck there.

For getting styling you mention, there's 2 approach, one to use what we
have and try to style ( I think this is limited), the second is use some
good library out there like MDL, BootStrap, or others. I'm on the works as
you already know with MDL. Right now I'm doing components in the "mdl"
namespace, but this is not the ideal scenario, since it would be great to
get a MDL style in a js:Button without the need to change it to mdl:Button,
only applying styles.

I'm finding some more few things:

* CSS styles already in place are very cumbersome and I think we would need
to work on a clean separation to avoid mixing and generating side effect.
Alex propose in other thread some compiler options to avoid include
CSS...maybe this is a nice option.
* classNames and typeNames are part of the problems, but only due to the
before mentioned point. If we can compile without already set styles this
could solve the problem.
* With MDL I'm inserting classNames inside class components, what I don't
like since is a clear mixing of AS3 code declaration with CSS styles.
* from the experience I'm getting with MDL (and suppose that other
libraries like bootstrap will be the same), those good looking styles are
dependent from a concrete way of implementing the html tags and use of html
class. Maybe a component need to create a surrounding div and then nest a
span, and this maybe is not what our HTML implementation does. I think a
right approach should be to use the HTML swc and be able to change the
output to match what a concrete style demands.

For example, I'm making a Card component (and btw learning how flexjs
framework works):
https://getmdl.io/components/#cards-section

This could be some kind of a Panel...but is not a Panel, so better create a
Card component, but if you see the structure, is completely made to use the
MDL style...

looking at the MobileStocks code, it seems, the approach is the first one,
since is all made with FlexJS comps. In that scenario, I think we need as
well a way to not be bloated with CSS styles that we don't know where came
from. and start from a clean state.

I think this is something like a prerequisite in order to be able to work
in some kind of styling.

Hope I could first build MobileStocks and try on my iPhone to get a look at
what we are talking about.

Thanks

Carlos




2016-10-21 15:53 GMT+02:00 Peter Ent <pe...@adobe.com>:

> Hi,
>
> We've been working on an improved FlexJS mobile app: MobileStocks. It is
> in the FlexJS examples directory. This example runs on both Android and iOS
> devices and is a version of MobileTrader, offering just two views. The
> first view allows you to enter a stock symbol and a number of shares. It
> then puts that information into a DataGrid and a chart, monitoring the
> change in prices and updating the grid and chart. The second view allows
> you to enter a symbol and watch it in a similar fashion.  MobileStocks uses
> the FlexJS Storage project to retain the list of stocks between sessions.
>
> MobileStocks uses Apache Cordova, making the app run on both iOS and
> Android from a single code base. Cordova integration is handled by the
> FlexJS Mobile project as well as the Storage project.
>
> Building and running the app is pretty simple and you can do it from the
> command line or from Flash Builder. If you want to use the command line,
> pull down the source and run ANT to build the js-debug directory. Then run
> "ant -f ../../../cordova-build.xml" to create the Apache Cordova
> sub-project. Once that has done, connect your Android device to your
> computer and run "ant -f ../../../cordova-build.xml run.android" which will
> download a little more and then install and run the app on your device.
> iOS users can do the same thing (use "run.ios") which will launch the
> device simulator; you also need to have Xcode installed.
>
> You can run this example easily from Flash Builder by following the
> instructions on the FlexJS wiki [1] and use the launch configurations to
> build and run the app.
>
> The example has shown us a couple of things.
>
>   *   We needed to make more beads to handle different types of data
> providers in the pay-as-you-go world of FlexJS; this keeps the app as small
> as possible.
>   *   We needed to add additional layouts that were more responsive to
> resizing.
>   *   We needed to fix a couple of bugs as well.
>
> Please give this a try if you can. The next step for the app would be some
> nice styling. This my "developer's eye" which is just minimal, so
> contribute some updates to that, if you can.
>
> [1] https://cwiki.apache.org/confluence/pages/viewpage.
> action?pageId=63406558
>
> Regards,
> Peter Ent
> Adobe Systems/Apache Flex Project
>



-- 

Carlos Rovira
Director General
M: +34 607 22 60 05
http://www.codeoscopic.com
http://www.avant2.es


Este mensaje se dirige exclusivamente a su destinatario y puede contener
información privilegiada o confidencial. Si ha recibido este mensaje por
error, le rogamos que nos lo comunique inmediatamente por esta misma vía y
proceda a su destrucción.

De la vigente Ley Orgánica de Protección de Datos (15/1999), le comunicamos
que sus datos forman parte de un fichero cuyo responsable es CODEOSCOPIC
S.A. La finalidad de dicho tratamiento es facilitar la prestación del
servicio o información solicitados, teniendo usted derecho de acceso,
rectificación, cancelación y oposición de sus datos dirigiéndose a nuestras
oficinas c/ Paseo de la Habana 9-11, 28036, Madrid con la documentación
necesaria.