UI development in Amber

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
26 messages Options
12
Reply | Threaded
Open this post in threaded view
|

UI development in Amber

garduino
Hi Guys:

What are the ways you use for develop nice UIs in Amber? Are you using
things as YUI directly from Amber?

Cheers.
Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Nicolas Petton
On Wed, 2012-01-25 at 15:08 -0800, Germán Arduino wrote:
> Hi Guys:
>
> What are the ways you use for develop nice UIs in Amber? Are you using
> things as YUI directly from Amber?

Hi German,

Yes, you can use the library you want directly from Amber. Lately I
wanted to give Ukijs a try: http://ukijs.org/

Cheers,
Nico

Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

laurent laffont
In reply to this post by garduino
I have some experience with jqueryui http://jqueryui.com/themeroller/.  Not really fun but docs & lot of (often bad written) plugins on the web

Laurent

On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino <[hidden email]> wrote:
Hi Guys:

What are the ways you use for develop nice UIs in Amber? Are you using
things as YUI directly from Amber?

Cheers.

Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Rodo
Hi all,

What is the general idea regarding UI's  in Amber? Is it part of the roadmap to develop Amber wrappers for one or more of these UI frameworks or is it the idea to just use them as-is in Amber?

Regards,

Ron

2012/1/26 laurent laffont <[hidden email]>
I have some experience with jqueryui http://jqueryui.com/themeroller/.  Not really fun but docs & lot of (often bad written) plugins on the web

Laurent


On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino <[hidden email]> wrote:
Hi Guys:

What are the ways you use for develop nice UIs in Amber? Are you using
things as YUI directly from Amber?

Cheers.


Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Nicolas Petton
Since Amber plays well with others, I don't feel the need for such
wrappers at all.

Cheers,
Nico

On Thu, 2012-01-26 at 15:05 +0100, Ron Dobbelstein wrote:

> Hi all,
>
>
> What is the general idea regarding UI's  in Amber? Is it part of the
> roadmap to develop Amber wrappers for one or more of these UI
> frameworks or is it the idea to just use them as-is in Amber?
>
> Regards,
>
>
> Ron
>
> 2012/1/26 laurent laffont <[hidden email]>
>         I have some experience with
>         jqueryui http://jqueryui.com/themeroller/.  Not really fun but
>         docs & lot of (often bad written) plugins on the web
>        
>        
>         Laurent
>        
>        
>         On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino
>         <[hidden email]> wrote:
>                 Hi Guys:
>                
>                 What are the ways you use for develop nice UIs in
>                 Amber? Are you using
>                 things as YUI directly from Amber?
>                
>                 Cheers.
>        
>        
>
>


Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Hannes Hirzel
The reason is that the full API of a JavaScript library is accessible
from Amber.

You do not need a wrapper but you have to use the JavaScript =>
Smalltalk mapping rules

From the presentation contained in the Amber release
\examples\presentation\index.html:

JavaScript                    ⇒     Smalltalk

someUser.name           ⇒    someUser name

someUser name = "John"      ⇒       someUser name: 'John'

console.log('hello world')      ⇒  console log: 'hello world'

window.jQuery('foo').css('background', 'red')          ⇒
(window jQuery: 'foo') css: 'background' color: 'red'


Note that JavaScript

aObj.methodName(arg1, arg2, arg3)

maps to

Smalltalk

aObj   methodName: arg1  bla:  arg2  blah: arg3)
or
aObj   methodName: arg1  abc:  arg2  def: arg3)
or
aObj   methodName: arg1  bbb:  arg2  ccc: arg3)

Thus only the first part of the keyword message matters. For the other
parts anything is possible.

So you load a JavaScript library and everything is accessible from the
Amber workspace and Amber Smalltalk classes code by following these
rules. This is something straightforward once you have got the idea
but not obvious in the first place. In addition it needs some time to
get used to (thinking in two languages at the same time). However as
JavaScript has objects with methods as Smalltalk it maps fairly well.


Example/Illustration:

localStorage is a globally accessible JavaScript object

localStorage.setItem('rot','red');
localStorage.setItem('gelb','yellow');
localStorage.setItem('blau','blue');

It maps to

localStorage setItem: 'rot' value: 'red'.
localStorage setItem: 'gelb' val: 'yellow'.
localStorage setItem: 'blau' wert: 'blue'.

HTH

Hannes

On 1/26/12, Nicolas Petton <[hidden email]> wrote:

> Since Amber plays well with others, I don't feel the need for such
> wrappers at all.
>
> Cheers,
> Nico
>
> On Thu, 2012-01-26 at 15:05 +0100, Ron Dobbelstein wrote:
>> Hi all,
>>
>>
>> What is the general idea regarding UI's  in Amber? Is it part of the
>> roadmap to develop Amber wrappers for one or more of these UI
>> frameworks or is it the idea to just use them as-is in Amber?
>>
>> Regards,
>>
>>
>> Ron
>>
>> 2012/1/26 laurent laffont <[hidden email]>
>>         I have some experience with
>>         jqueryui http://jqueryui.com/themeroller/.  Not really fun but
>>         docs & lot of (often bad written) plugins on the web
>>
>>
>>         Laurent
>>
>>
>>         On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino
>>         <[hidden email]> wrote:
>>                 Hi Guys:
>>
>>                 What are the ways you use for develop nice UIs in
>>                 Amber? Are you using
>>                 things as YUI directly from Amber?
>>
>>                 Cheers.
>>
>>
>>
>>
>
>
>
Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

leonsmith
Thanks Hannes, short, concise tips like this are very helpful.

On Jan 26, 7:22 am, "H. Hirzel" <[hidden email]> wrote:

> The reason is that the full API of a JavaScript library is accessible
> from Amber.
>
> You do not need a wrapper but you have to use the JavaScript =>
> Smalltalk mapping rules
>
> From the presentation contained in the Amber release
> \examples\presentation\index.html:
>
> JavaScript                    =>     Smalltalk
>
> someUser.name           =>    someUser name
>
> someUser name = "John"      =>       someUser name: 'John'
>
> console.log('hello world')      =>  console log: 'hello world'
>
> window.jQuery('foo').css('background', 'red')          =>
> (window jQuery: 'foo') css: 'background' color: 'red'
>
> Note that JavaScript
>
> aObj.methodName(arg1, arg2, arg3)
>
> maps to
>
> Smalltalk
>
> aObj   methodName: arg1  bla:  arg2  blah: arg3)
> or
> aObj   methodName: arg1  abc:  arg2  def: arg3)
> or
> aObj   methodName: arg1  bbb:  arg2  ccc: arg3)
>
> Thus only the first part of the keyword message matters. For the other
> parts anything is possible.
>
> So you load a JavaScript library and everything is accessible from the
> Amber workspace and Amber Smalltalk classes code by following these
> rules. This is something straightforward once you have got the idea
> but not obvious in the first place. In addition it needs some time to
> get used to (thinking in two languages at the same time). However as
> JavaScript has objects with methods as Smalltalk it maps fairly well.
>
> Example/Illustration:
>
> localStorage is a globally accessible JavaScript object
>
> localStorage.setItem('rot','red');
> localStorage.setItem('gelb','yellow');
> localStorage.setItem('blau','blue');
>
> It maps to
>
> localStorage setItem: 'rot' value: 'red'.
> localStorage setItem: 'gelb' val: 'yellow'.
> localStorage setItem: 'blau' wert: 'blue'.
>
> HTH
>
> Hannes
>
> On 1/26/12, Nicolas Petton <[hidden email]> wrote:
>
>
>
>
>
>
>
> > Since Amber plays well with others, I don't feel the need for such
> > wrappers at all.
>
> > Cheers,
> > Nico
>
> > On Thu, 2012-01-26 at 15:05 +0100, Ron Dobbelstein wrote:
> >> Hi all,
>
> >> What is the general idea regarding UI's  in Amber? Is it part of the
> >> roadmap to develop Amber wrappers for one or more of these UI
> >> frameworks or is it the idea to just use them as-is in Amber?
>
> >> Regards,
>
> >> Ron
>
> >> 2012/1/26 laurent laffont <[hidden email]>
> >>         I have some experience with
> >>         jqueryuihttp://jqueryui.com/themeroller/.  Not really fun but
> >>         docs & lot of (often bad written) plugins on the web
>
> >>         Laurent
>
> >>         On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino
> >>         <[hidden email]> wrote:
> >>                 Hi Guys:
>
> >>                 What are the ways you use for develop nice UIs in
> >>                 Amber? Are you using
> >>                 things as YUI directly from Amber?
>
> >>                 Cheers.
Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Kevin Driedger-4
Anyone tried to use Amber with Cappuccino?  It seems to be a different beast because it is written in Objective-J.  I understand you can call out to Javascript but I haven't found anything about calling into cappuccino.   I think it should be possible as Objective J compiles to javascript just like Amber does.

]{evin


On Thu, Jan 26, 2012 at 11:03 AM, leonsmith <[hidden email]> wrote:
Thanks Hannes, short, concise tips like this are very helpful.

On Jan 26, 7:22 am, "H. Hirzel" <[hidden email]> wrote:
> The reason is that the full API of a JavaScript library is accessible
> from Amber.
>
> You do not need a wrapper but you have to use the JavaScript =>
> Smalltalk mapping rules
>
> From the presentation contained in the Amber release
> \examples\presentation\index.html:
>
> JavaScript                    =>     Smalltalk
>
> someUser.name           =>    someUser name
>
> someUser name = "John"      =>       someUser name: 'John'
>
> console.log('hello world')      =>  console log: 'hello world'
>
> window.jQuery('foo').css('background', 'red')          =>
> (window jQuery: 'foo') css: 'background' color: 'red'
>
> Note that JavaScript
>
> aObj.methodName(arg1, arg2, arg3)
>
> maps to
>
> Smalltalk
>
> aObj   methodName: arg1  bla:  arg2  blah: arg3)
> or
> aObj   methodName: arg1  abc:  arg2  def: arg3)
> or
> aObj   methodName: arg1  bbb:  arg2  ccc: arg3)
>
> Thus only the first part of the keyword message matters. For the other
> parts anything is possible.
>
> So you load a JavaScript library and everything is accessible from the
> Amber workspace and Amber Smalltalk classes code by following these
> rules. This is something straightforward once you have got the idea
> but not obvious in the first place. In addition it needs some time to
> get used to (thinking in two languages at the same time). However as
> JavaScript has objects with methods as Smalltalk it maps fairly well.
>
> Example/Illustration:
>
> localStorage is a globally accessible JavaScript object
>
> localStorage.setItem('rot','red');
> localStorage.setItem('gelb','yellow');
> localStorage.setItem('blau','blue');
>
> It maps to
>
> localStorage setItem: 'rot' value: 'red'.
> localStorage setItem: 'gelb' val: 'yellow'.
> localStorage setItem: 'blau' wert: 'blue'.
>
> HTH
>
> Hannes
>
> On 1/26/12, Nicolas Petton <[hidden email]> wrote:
>
>
>
>
>
>
>
> > Since Amber plays well with others, I don't feel the need for such
> > wrappers at all.
>
> > Cheers,
> > Nico
>
> > On Thu, 2012-01-26 at 15:05 +0100, Ron Dobbelstein wrote:
> >> Hi all,
>
> >> What is the general idea regarding UI's  in Amber? Is it part of the
> >> roadmap to develop Amber wrappers for one or more of these UI
> >> frameworks or is it the idea to just use them as-is in Amber?
>
> >> Regards,
>
> >> Ron
>
> >> 2012/1/26 laurent laffont <[hidden email]>
> >>         I have some experience with
> >>         jqueryuihttp://jqueryui.com/themeroller/.  Not really fun but
> >>         docs & lot of (often bad written) plugins on the web
>
> >>         Laurent
>
> >>         On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino
> >>         <[hidden email]> wrote:
> >>                 Hi Guys:
>
> >>                 What are the ways you use for develop nice UIs in
> >>                 Amber? Are you using
> >>                 things as YUI directly from Amber?
>
> >>                 Cheers.

Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

gokr
In reply to this post by Hannes Hirzel
This stuff and similar info on the wiki should be included in the documentation (class comment) for JSObjectProxy.

regards, Göran



-- Sent from my Palm Pre 2, wohoo!


On Jan 26, 2012 16:22, H. Hirzel <[hidden email]> wrote:

The reason is that the full API of a JavaScript library is accessible
from Amber.

You do not need a wrapper but you have to use the JavaScript =>
Smalltalk mapping rules

From the presentation contained in the Amber release
\examples\presentation\index.html:

JavaScript ⇒ Smalltalk

someUser.name ⇒ someUser name

someUser name = "John" ⇒ someUser name: 'John'

console.log('hello world') ⇒ console log: 'hello world'

window.jQuery('foo').css('background', 'red') ⇒
(window jQuery: 'foo') css: 'background' color: 'red'


Note that JavaScript

aObj.methodName(arg1, arg2, arg3)

maps to

Smalltalk

aObj methodName: arg1 bla: arg2 blah: arg3)
or
aObj methodName: arg1 abc: arg2 def: arg3)
or
aObj methodName: arg1 bbb: arg2 ccc: arg3)

Thus only the first part of the keyword message matters. For the other
parts anything is possible.

So you load a JavaScript library and everything is accessible from the
Amber workspace and Amber Smalltalk classes code by following these
rules. This is something straightforward once you have got the idea
but not obvious in the first place. In addition it needs some time to
get used to (thinking in two languages at the same time). However as
JavaScript has objects with methods as Smalltalk it maps fairly well.


Example/Illustration:

localStorage is a globally accessible JavaScript object

localStorage.setItem('rot','red');
localStorage.setItem('gelb','yellow');
localStorage.setItem('blau','blue');

It maps to

localStorage setItem: 'rot' value: 'red'.
localStorage setItem: 'gelb' val: 'yellow'.
localStorage setItem: 'blau' wert: 'blue'.

HTH

Hannes

On 1/26/12, Nicolas Petton <[hidden email]> wrote:

> Since Amber plays well with others, I don't feel the need for such
> wrappers at all.
>
> Cheers,
> Nico
>
> On Thu, 2012-01-26 at 15:05 +0100, Ron Dobbelstein wrote:
>> Hi all,
>>
>>
>> What is the general idea regarding UI's in Amber? Is it part of the
>> roadmap to develop Amber wrappers for one or more of these UI
>> frameworks or is it the idea to just use them as-is in Amber?
>>
>> Regards,
>>
>>
>> Ron
>>
>> 2012/1/26 laurent laffont <[hidden email]>
>> I have some experience with
>> jqueryui http://jqueryui.com/themeroller/. Not really fun but
>> docs & lot of (often bad written) plugins on the web
>>
>>
>> Laurent
>>
>>
>> On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino
>> <[hidden email]> wrote:
>> Hi Guys:
>>
>> What are the ways you use for develop nice UIs in
>> Amber? Are you using
>> things as YUI directly from Amber?
>>
>> Cheers.
>>
>>
>>
>>
>
>
>
Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Guido Stepken

Your browser ans node.js based PalmPre WebOS, mainly written in JavaScript, has just been released under Apache Licence (similar to GNUv3).
Should be interesting to controll that from Amber Smalltalk!

Have fun, Guido Stepken

Am 26.01.2012 17:25 schrieb "Göran Krampe" <[hidden email]>:
This stuff and similar info on the wiki should be included in the documentation (class comment) for JSObjectProxy.

regards, Göran



-- Sent from my Palm Pre 2, wohoo!


On Jan 26, 2012 16:22, H. Hirzel <[hidden email]> wrote:

The reason is that the full API of a JavaScript library is accessible
from Amber.

You do not need a wrapper but you have to use the JavaScript =>
Smalltalk mapping rules

From the presentation contained in the Amber release
\examples\presentation\index.html:

JavaScript ⇒ Smalltalk

someUser.name ⇒ someUser name

someUser name = "John" ⇒ someUser name: 'John'

console.log('hello world') ⇒ console log: 'hello world'

window.jQuery('foo').css('background', 'red') ⇒
(window jQuery: 'foo') css: 'background' color: 'red'


Note that JavaScript

aObj.methodName(arg1, arg2, arg3)

maps to

Smalltalk

aObj methodName: arg1 bla: arg2 blah: arg3)
or
aObj methodName: arg1 abc: arg2 def: arg3)
or
aObj methodName: arg1 bbb: arg2 ccc: arg3)

Thus only the first part of the keyword message matters. For the other
parts anything is possible.

So you load a JavaScript library and everything is accessible from the
Amber workspace and Amber Smalltalk classes code by following these
rules. This is something straightforward once you have got the idea
but not obvious in the first place. In addition it needs some time to
get used to (thinking in two languages at the same time). However as
JavaScript has objects with methods as Smalltalk it maps fairly well.


Example/Illustration:

localStorage is a globally accessible JavaScript object

localStorage.setItem('rot','red');
localStorage.setItem('gelb','yellow');
localStorage.setItem('blau','blue');

It maps to

localStorage setItem: 'rot' value: 'red'.
localStorage setItem: 'gelb' val: 'yellow'.
localStorage setItem: 'blau' wert: 'blue'.

HTH

Hannes

On 1/26/12, Nicolas Petton <[hidden email]> wrote:

> Since Amber plays well with others, I don't feel the need for such
> wrappers at all.
>
> Cheers,
> Nico
>
> On Thu, 2012-01-26 at 15:05 +0100, Ron Dobbelstein wrote:
>> Hi all,
>>
>>
>> What is the general idea regarding UI's in Amber? Is it part of the
>> roadmap to develop Amber wrappers for one or more of these UI
>> frameworks or is it the idea to just use them as-is in Amber?
>>
>> Regards,
>>
>>
>> Ron
>>
>> 2012/1/26 laurent laffont <[hidden email]>
>> I have some experience with
>> jqueryui http://jqueryui.com/themeroller/. Not really fun but
>> docs & lot of (often bad written) plugins on the web
>>
>>
>> Laurent
>>
>>
>> On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino
>> <[hidden email]> wrote:
>> Hi Guys:
>>
>> What are the ways you use for develop nice UIs in
>> Amber? Are you using
>> things as YUI directly from Amber?
>>
>> Cheers.
>>
>>
>>
>>
>
>
>
Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

gokr
I have already written a demo app in Amber for webOS called Eris, we showed it in Edinburg and it is in the git repo. It ran using native UI on the Touchpad, which I also bought the day before the demo. :)

regards, Göran



-- Sent from my Palm Pre 2, wohoo!


On Jan 26, 2012 17:31, Guido Stepken <[hidden email]> wrote:

Your browser ans node.js based PalmPre WebOS, mainly written in JavaScript, has just been released under Apache Licence (similar to GNUv3).
Should be interesting to controll that from Amber Smalltalk!

Have fun, Guido Stepken

Am 26.01.2012 17:25 schrieb "Göran Krampe" <[hidden email]>:
This stuff and similar info on the wiki should be included in the documentation (class comment) for JSObjectProxy.

regards, Göran



-- Sent from my Palm Pre 2, wohoo!


On Jan 26, 2012 16:22, H. Hirzel <[hidden email]> wrote:

The reason is that the full API of a JavaScript library is accessible
from Amber.

You do not need a wrapper but you have to use the JavaScript =>
Smalltalk mapping rules

From the presentation contained in the Amber release
\examples\presentation\index.html:

JavaScript ⇒ Smalltalk

someUser.name ⇒ someUser name

someUser name = "John" ⇒ someUser name: 'John'

console.log('hello world') ⇒ console log: 'hello world'

window.jQuery('foo').css('background', 'red') ⇒
(window jQuery: 'foo') css: 'background' color: 'red'


Note that JavaScript

aObj.methodName(arg1, arg2, arg3)

maps to

Smalltalk

aObj methodName: arg1 bla: arg2 blah: arg3)
or
aObj methodName: arg1 abc: arg2 def: arg3)
or
aObj methodName: arg1 bbb: arg2 ccc: arg3)

Thus only the first part of the keyword message matters. For the other
parts anything is possible.

So you load a JavaScript library and everything is accessible from the
Amber workspace and Amber Smalltalk classes code by following these
rules. This is something straightforward once you have got the idea
but not obvious in the first place. In addition it needs some time to
get used to (thinking in two languages at the same time). However as
JavaScript has objects with methods as Smalltalk it maps fairly well.


Example/Illustration:

localStorage is a globally accessible JavaScript object

localStorage.setItem('rot','red');
localStorage.setItem('gelb','yellow');
localStorage.setItem('blau','blue');

It maps to

localStorage setItem: 'rot' value: 'red'.
localStorage setItem: 'gelb' val: 'yellow'.
localStorage setItem: 'blau' wert: 'blue'.

HTH

Hannes

On 1/26/12, Nicolas Petton <[hidden email]> wrote:

> Since Amber plays well with others, I don't feel the need for such
> wrappers at all.
>
> Cheers,
> Nico
>
> On Thu, 2012-01-26 at 15:05 +0100, Ron Dobbelstein wrote:
>> Hi all,
>>
>>
>> What is the general idea regarding UI's in Amber? Is it part of the
>> roadmap to develop Amber wrappers for one or more of these UI
>> frameworks or is it the idea to just use them as-is in Amber?
>>
>> Regards,
>>
>>
>> Ron
>>
>> 2012/1/26 laurent laffont <[hidden email]>
>> I have some experience with
>> jqueryui http://jqueryui.com/themeroller/. Not really fun but
>> docs & lot of (often bad written) plugins on the web
>>
>>
>> Laurent
>>
>>
>> On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino
>> <[hidden email]> wrote:
>> Hi Guys:
>>
>> What are the ways you use for develop nice UIs in
>> Amber? Are you using
>> things as YUI directly from Amber?
>>
>> Cheers.
>>
>>
>>
>>
>
>
>
Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Guido Stepken

WebOS is a *masterpiece* of Javascript software, a complete OS written in Browser, with a "specialized node.js" for accessing, controlling hardware, GPS, GSM, compass, sound, mic,  video ... love that!

Has a great future, like Amber!

Amber could be THE "bridge technology" for many JavaScript programmers back to Smalltalk programming, a possible revivial.

regards, Guido Stepken

Am 26.01.2012 17:39 schrieb "Göran Krampe" <[hidden email]>:
I have already written a demo app in Amber for webOS called Eris, we showed it in Edinburg and it is in the git repo. It ran using native UI on the Touchpad, which I also bought the day before the demo. :)

regards, Göran



-- Sent from my Palm Pre 2, wohoo!


On Jan 26, 2012 17:31, Guido Stepken <[hidden email]> wrote:

Your browser ans node.js based PalmPre WebOS, mainly written in JavaScript, has just been released under Apache Licence (similar to GNUv3).
Should be interesting to controll that from Amber Smalltalk!

Have fun, Guido Stepken

Am 26.01.2012 17:25 schrieb "Göran Krampe" <[hidden email]>:
This stuff and similar info on the wiki should be included in the documentation (class comment) for JSObjectProxy.

regards, Göran



-- Sent from my Palm Pre 2, wohoo!


On Jan 26, 2012 16:22, H. Hirzel <[hidden email]> wrote:

The reason is that the full API of a JavaScript library is accessible
from Amber.

You do not need a wrapper but you have to use the JavaScript =>
Smalltalk mapping rules

From the presentation contained in the Amber release
\examples\presentation\index.html:

JavaScript ⇒ Smalltalk

someUser.name ⇒ someUser name

someUser name = "John" ⇒ someUser name: 'John'

console.log('hello world') ⇒ console log: 'hello world'

window.jQuery('foo').css('background', 'red') ⇒
(window jQuery: 'foo') css: 'background' color: 'red'


Note that JavaScript

aObj.methodName(arg1, arg2, arg3)

maps to

Smalltalk

aObj methodName: arg1 bla: arg2 blah: arg3)
or
aObj methodName: arg1 abc: arg2 def: arg3)
or
aObj methodName: arg1 bbb: arg2 ccc: arg3)

Thus only the first part of the keyword message matters. For the other
parts anything is possible.

So you load a JavaScript library and everything is accessible from the
Amber workspace and Amber Smalltalk classes code by following these
rules. This is something straightforward once you have got the idea
but not obvious in the first place. In addition it needs some time to
get used to (thinking in two languages at the same time). However as
JavaScript has objects with methods as Smalltalk it maps fairly well.


Example/Illustration:

localStorage is a globally accessible JavaScript object

localStorage.setItem('rot','red');
localStorage.setItem('gelb','yellow');
localStorage.setItem('blau','blue');

It maps to

localStorage setItem: 'rot' value: 'red'.
localStorage setItem: 'gelb' val: 'yellow'.
localStorage setItem: 'blau' wert: 'blue'.

HTH

Hannes

On 1/26/12, Nicolas Petton <[hidden email]> wrote:

> Since Amber plays well with others, I don't feel the need for such
> wrappers at all.
>
> Cheers,
> Nico
>
> On Thu, 2012-01-26 at 15:05 +0100, Ron Dobbelstein wrote:
>> Hi all,
>>
>>
>> What is the general idea regarding UI's in Amber? Is it part of the
>> roadmap to develop Amber wrappers for one or more of these UI
>> frameworks or is it the idea to just use them as-is in Amber?
>>
>> Regards,
>>
>>
>> Ron
>>
>> 2012/1/26 laurent laffont <[hidden email]>
>> I have some experience with
>> jqueryui http://jqueryui.com/themeroller/. Not really fun but
>> docs & lot of (often bad written) plugins on the web
>>
>>
>> Laurent
>>
>>
>> On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino
>> <[hidden email]> wrote:
>> Hi Guys:
>>
>> What are the ways you use for develop nice UIs in
>> Amber? Are you using
>> things as YUI directly from Amber?
>>
>> Cheers.
>>
>>
>>
>>
>
>
>
Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Hannes Hirzel
The post of yesterday
http://developer.palm.com/blog/2012/01/welcome-to-webos-open-source/#more-5085

announces the release of Enyo on the new web site

http://enyojs.com/

"Enyo is an open source object-oriented JavaScript framework
emphasizing encapsulation and modularity. Enyo contains everything you
need to create a fast, scalable mobile or web application"

HJH

On 1/26/12, Guido Stepken <[hidden email]> wrote:

> WebOS is a *masterpiece* of Javascript software, a complete OS written in
> Browser, with a "specialized node.js" for accessing, controlling hardware,
> GPS, GSM, compass, sound, mic,  video ... love that!
>
> Has a great future, like Amber!
>
> Amber could be THE "bridge technology" for many JavaScript programmers back
> to Smalltalk programming, a possible revivial.
>
> regards, Guido Stepken
> Am 26.01.2012 17:39 schrieb "Göran Krampe" <[hidden email]>:
>
>> I have already written a demo app in Amber for webOS called Eris, we
>> showed it in Edinburg and it is in the git repo. It ran using native UI on
>> the Touchpad, which I also bought the day before the demo. :)
>>
>> regards, Göran
>>
>>
>>
>> -- Sent from my Palm Pre 2, wohoo!
>>
>> ------------------------------
>> On Jan 26, 2012 17:31, Guido Stepken <[hidden email]> wrote:
>>
>> Your browser ans node.js based PalmPre WebOS, mainly written in
>> JavaScript, has just been released under Apache Licence (similar to
>> GNUv3).
>> Should be interesting to controll that from Amber Smalltalk!
>>
>> Have fun, Guido Stepken
>> Am 26.01.2012 17:25 schrieb "Göran Krampe" <[hidden email]>:
>>
>>> This stuff and similar info on the wiki should be included in the
>>> documentation (class comment) for JSObjectProxy.
>>>
>>> regards, Göran
>>>
>>>
>>>
>>> -- Sent from my Palm Pre 2, wohoo!
>>>
>>> ------------------------------
>>> On Jan 26, 2012 16:22, H. Hirzel <[hidden email]> wrote:
>>>
>>> The reason is that the full API of a JavaScript library is accessible
>>> from Amber.
>>>
>>> You do not need a wrapper but you have to use the JavaScript =>
>>> Smalltalk mapping rules
>>>
>>> From the presentation contained in the Amber release
>>> \examples\presentation\index.html:
>>>
>>> JavaScript ⇒ Smalltalk
>>>
>>> someUser.name ⇒ someUser name
>>>
>>> someUser name = "John" ⇒ someUser name: 'John'
>>>
>>> console.log('hello world') ⇒ console log: 'hello world'
>>>
>>> window.jQuery('foo').css('background', 'red') ⇒
>>> (window jQuery: 'foo') css: 'background' color: 'red'
>>>
>>>
>>> Note that JavaScript
>>>
>>> aObj.methodName(arg1, arg2, arg3)
>>>
>>> maps to
>>>
>>> Smalltalk
>>>
>>> aObj methodName: arg1 bla: arg2 blah: arg3)
>>> or
>>> aObj methodName: arg1 abc: arg2 def: arg3)
>>> or
>>> aObj methodName: arg1 bbb: arg2 ccc: arg3)
>>>
>>> Thus only the first part of the keyword message matters. For the other
>>> parts anything is possible.
>>>
>>> So you load a JavaScript library and everything is accessible from the
>>> Amber workspace and Amber Smalltalk classes code by following these
>>> rules. This is something straightforward once you have got the idea
>>> but not obvious in the first place. In addition it needs some time to
>>> get used to (thinking in two languages at the same time). However as
>>> JavaScript has objects with methods as Smalltalk it maps fairly well.
>>>
>>>
>>> Example/Illustration:
>>>
>>> localStorage is a globally accessible JavaScript object
>>>
>>> localStorage.setItem('rot','red');
>>> localStorage.setItem('gelb','yellow');
>>> localStorage.setItem('blau','blue');
>>>
>>> It maps to
>>>
>>> localStorage setItem: 'rot' value: 'red'.
>>> localStorage setItem: 'gelb' val: 'yellow'.
>>> localStorage setItem: 'blau' wert: 'blue'.
>>>
>>> HTH
>>>
>>> Hannes
>>>
>>> On 1/26/12, Nicolas Petton <[hidden email]> wrote:
>>> > Since Amber plays well with others, I don't feel the need for such
>>> > wrappers at all.
>>> >
>>> > Cheers,
>>> > Nico
>>> >
>>> > On Thu, 2012-01-26 at 15:05 +0100, Ron Dobbelstein wrote:
>>> >> Hi all,
>>> >>
>>> >>
>>> >> What is the general idea regarding UI's in Amber? Is it part of the
>>> >> roadmap to develop Amber wrappers for one or more of these UI
>>> >> frameworks or is it the idea to just use them as-is in Amber?
>>> >>
>>> >> Regards,
>>> >>
>>> >>
>>> >> Ron
>>> >>
>>> >> 2012/1/26 laurent laffont <[hidden email]>
>>> >> I have some experience with
>>> >> jqueryui http://jqueryui.com/themeroller/. Not really fun but
>>> >> docs & lot of (often bad written) plugins on the web
>>> >>
>>> >>
>>> >> Laurent
>>> >>
>>> >>
>>> >> On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino
>>> >> <[hidden email]> wrote:
>>> >> Hi Guys:
>>> >>
>>> >> What are the ways you use for develop nice UIs in
>>> >> Amber? Are you using
>>> >> things as YUI directly from Amber?
>>> >>
>>> >> Cheers.
>>> >>
>>> >>
>>> >>
>>> >>
>>> >
>>> >
>>> >
>>>
>>
>
Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

gokr
Yeah, Enyo is the new js UI framework that Eris (my little demo) is built with.

regards, Göran



-- Sent from my Palm Pre 2, wohoo!


On Jan 26, 2012 19:49, H. Hirzel <[hidden email]> wrote:

The post of yesterday
http://developer.palm.com/blog/2012/01/welcome-to-webos-open-source/#more-5085

announces the release of Enyo on the new web site

http://enyojs.com/

"Enyo is an open source object-oriented JavaScript framework
emphasizing encapsulation and modularity. Enyo contains everything you
need to create a fast, scalable mobile or web application"

HJH

On 1/26/12, Guido Stepken <[hidden email]> wrote:

> WebOS is a *masterpiece* of Javascript software, a complete OS written in
> Browser, with a "specialized node.js" for accessing, controlling hardware,
> GPS, GSM, compass, sound, mic, video ... love that!
>
> Has a great future, like Amber!
>
> Amber could be THE "bridge technology" for many JavaScript programmers back
> to Smalltalk programming, a possible revivial.
>
> regards, Guido Stepken
> Am 26.01.2012 17:39 schrieb "Göran Krampe" <[hidden email]>:
>
>> I have already written a demo app in Amber for webOS called Eris, we
>> showed it in Edinburg and it is in the git repo. It ran using native UI on
>> the Touchpad, which I also bought the day before the demo. :)
>>
>> regards, Göran
>>
>>
>>
>> -- Sent from my Palm Pre 2, wohoo!
>>
>> ------------------------------
>> On Jan 26, 2012 17:31, Guido Stepken <[hidden email]> wrote:
>>
>> Your browser ans node.js based PalmPre WebOS, mainly written in
>> JavaScript, has just been released under Apache Licence (similar to
>> GNUv3).
>> Should be interesting to controll that from Amber Smalltalk!
>>
>> Have fun, Guido Stepken
>> Am 26.01.2012 17:25 schrieb "Göran Krampe" <[hidden email]>:
>>
>>> This stuff and similar info on the wiki should be included in the
>>> documentation (class comment) for JSObjectProxy.
>>>
>>> regards, Göran
>>>
>>>
>>>
>>> -- Sent from my Palm Pre 2, wohoo!
>>>
>>> ------------------------------
>>> On Jan 26, 2012 16:22, H. Hirzel <[hidden email]> wrote:
>>>
>>> The reason is that the full API of a JavaScript library is accessible
>>> from Amber.
>>>
>>> You do not need a wrapper but you have to use the JavaScript =>
>>> Smalltalk mapping rules
>>>
>>> From the presentation contained in the Amber release
>>> \examples\presentation\index.html:
>>>
>>> JavaScript ⇒ Smalltalk
>>>
>>> someUser.name ⇒ someUser name
>>>
>>> someUser name = "John" ⇒ someUser name: 'John'
>>>
>>> console.log('hello world') ⇒ console log: 'hello world'
>>>
>>> window.jQuery('foo').css('background', 'red') ⇒
>>> (window jQuery: 'foo') css: 'background' color: 'red'
>>>
>>>
>>> Note that JavaScript
>>>
>>> aObj.methodName(arg1, arg2, arg3)
>>>
>>> maps to
>>>
>>> Smalltalk
>>>
>>> aObj methodName: arg1 bla: arg2 blah: arg3)
>>> or
>>> aObj methodName: arg1 abc: arg2 def: arg3)
>>> or
>>> aObj methodName: arg1 bbb: arg2 ccc: arg3)
>>>
>>> Thus only the first part of the keyword message matters. For the other
>>> parts anything is possible.
>>>
>>> So you load a JavaScript library and everything is accessible from the
>>> Amber workspace and Amber Smalltalk classes code by following these
>>> rules. This is something straightforward once you have got the idea
>>> but not obvious in the first place. In addition it needs some time to
>>> get used to (thinking in two languages at the same time). However as
>>> JavaScript has objects with methods as Smalltalk it maps fairly well.
>>>
>>>
>>> Example/Illustration:
>>>
>>> localStorage is a globally accessible JavaScript object
>>>
>>> localStorage.setItem('rot','red');
>>> localStorage.setItem('gelb','yellow');
>>> localStorage.setItem('blau','blue');
>>>
>>> It maps to
>>>
>>> localStorage setItem: 'rot' value: 'red'.
>>> localStorage setItem: 'gelb' val: 'yellow'.
>>> localStorage setItem: 'blau' wert: 'blue'.
>>>
>>> HTH
>>>
>>> Hannes
>>>
>>> On 1/26/12, Nicolas Petton <[hidden email]> wrote:
>>> > Since Amber plays well with others, I don't feel the need for such
>>> > wrappers at all.
>>> >
>>> > Cheers,
>>> > Nico
>>> >
>>> > On Thu, 2012-01-26 at 15:05 +0100, Ron Dobbelstein wrote:
>>> >> Hi all,
>>> >>
>>> >>
>>> >> What is the general idea regarding UI's in Amber? Is it part of the
>>> >> roadmap to develop Amber wrappers for one or more of these UI
>>> >> frameworks or is it the idea to just use them as-is in Amber?
>>> >>
>>> >> Regards,
>>> >>
>>> >>
>>> >> Ron
>>> >>
>>> >> 2012/1/26 laurent laffont <[hidden email]>
>>> >> I have some experience with
>>> >> jqueryui http://jqueryui.com/themeroller/. Not really fun but
>>> >> docs & lot of (often bad written) plugins on the web
>>> >>
>>> >>
>>> >> Laurent
>>> >>
>>> >>
>>> >> On Thu, Jan 26, 2012 at 12:08 AM, Germán Arduino
>>> >> <[hidden email]> wrote:
>>> >> Hi Guys:
>>> >>
>>> >> What are the ways you use for develop nice UIs in
>>> >> Amber? Are you using
>>> >> things as YUI directly from Amber?
>>> >>
>>> >> Cheers.
>>> >>
>>> >>
>>> >>
>>> >>
>>> >
>>> >
>>> >
>>>
>>
>
Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

leonsmith
Hey German, thanks for pointing us to YUI. After a brief look it seems
very impressive !

Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

garduino
No problem! Is me that need to say thanks for all the responses,
specially Hannes response, a lot interesting to me.

Cheers.

On 26 ene, 19:48, leonsmith <[hidden email]> wrote:
> Hey German, thanks for pointing us to YUI. After a brief look it seems
> very impressive !
Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Amber Milan Eskridge
I've rewritten a part of Cappuccino and PastryKit in Amber. Works pretty well but took some time.

On Fri, Jan 27, 2012 at 12:12 AM, Germán Arduino <[hidden email]> wrote:
No problem! Is me that need to say thanks for all the responses,
specially Hannes response, a lot interesting to me.

Cheers.

On 26 ene, 19:48, leonsmith <[hidden email]> wrote:
> Hey German, thanks for pointing us to YUI. After a brief look it seems
> very impressive !

Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Hannes Hirzel
Did it take time because of Objective-J? This adds to the complexity
having three languages....

HJH

On 1/28/12, Amber Milan Eskridge <[hidden email]> wrote:

> I've rewritten a part of Cappuccino and PastryKit in Amber. Works pretty
> well but took some time.
>
> On Fri, Jan 27, 2012 at 12:12 AM, Germán Arduino <[hidden email]> wrote:
>
>> No problem! Is me that need to say thanks for all the responses,
>> specially Hannes response, a lot interesting to me.
>>
>> Cheers.
>>
>> On 26 ene, 19:48, leonsmith <[hidden email]> wrote:
>> > Hey German, thanks for pointing us to YUI. After a brief look it seems
>> > very impressive !
>>
>
Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Kevin Driedger-4
In reply to this post by Amber Milan Eskridge

That's good to hear!

Do you have the source posted anywhere?

On Jan 28, 2012 1:39 PM, "Amber Milan Eskridge" <[hidden email]> wrote:
I've rewritten a part of Cappuccino and PastryKit in Amber. Works pretty well but took some time.

On Fri, Jan 27, 2012 at 12:12 AM, Germán Arduino <[hidden email]> wrote:
No problem! Is me that need to say thanks for all the responses,
specially Hannes response, a lot interesting to me.

Cheers.

On 26 ene, 19:48, leonsmith <[hidden email]> wrote:
> Hey German, thanks for pointing us to YUI. After a brief look it seems
> very impressive !

Reply | Threaded
Open this post in threaded view
|

Re: UI development in Amber

Nicolas Petton
In reply to this post by Amber Milan Eskridge
On Sat, 2012-01-28 at 19:39 +0100, Amber Milan Eskridge wrote:
> I've rewritten a part of Cappuccino and PastryKit in Amber. Works
> pretty well but took some time.

Awesome!! Can we get the code? :)

Nico

>
> On Fri, Jan 27, 2012 at 12:12 AM, Germán Arduino <[hidden email]>
> wrote:
>         No problem! Is me that need to say thanks for all the
>         responses,
>         specially Hannes response, a lot interesting to me.
>        
>         Cheers.
>        
>         On 26 ene, 19:48, leonsmith <[hidden email]> wrote:
>         > Hey German, thanks for pointing us to YUI. After a brief
>         look it seems
>         > very impressive !
>


12