Smalltalk › Amber Smalltalk

newbie problem

_‹ Previous Topic Next Topic _›

Classic

List

Threaded

12 messages Options

leonsmith

newbie problem

Hi All, I've been using 0.9.1-4 for a few days now and it really
rocks, thanks guys ! Now I have a problem that I'm guessing is because
I'm new to Amber and the canvas. I have the model objects all created
for my game application with several example methods (for each class)
that run fine with no errors, but nothing outputs to the Canvas ! I've
looked at all the Amber examples index.html files and tried to pattern
mine from them. From Firefox developer tools I can see that all
necessary .js is being loaded and the halts I insert get sent and when
I inspect my model in the debugger everything is there.

So my questions are: Am I supposed to create a special method that
will be sent to me when the page is loaded (other than whats in
the .html? And does that receiver have to be a subclass of Widget or
can it just use a Widget as a view ?

I have tried a dozen variations of the html based on examples I've
found and this is what it currently looks like:

--------------------------------------------------------------------------------------------------
<html>
<head>
<title>Liars Dice in Amber</title>
<script src="../../js/amber.js" type="text/javascript"></script>
<script type="text/javascript">
loadAmber({
files: ['Dice.js'],
prefix: 'projects/dice/js',
ready: function() {
"smalltalk.TavernDice._example();"
}});
</script>
<script src="../../projects/dice/js/Dice.js" type="text/
javascript"></script>
</head>
<body>
<article>
<h1>Liars Dice in Amber</h1>
<button onclick="smalltalk.TavernDice._example()">TavernDice
example</button>
</article>
</body>
</html>

-------------------------------------------------------------------------------------------------

I am so close and tired of banging my head against a wall. Any
suggestions are very welcome. Thanks in advance.

gokr

Re: newbie problem

(on subway)

Are you in fact somewhere using jQuery to "append" your widgets to the DOM?

This part is not described that well in our docs/wiki so far I guess.

regards, Göran

-- Sent from my Palm Pre 2, wohoo!

On Jan 19, 2012 17:14, leonsmith <[hidden email]> wrote:

Hi All, I've been using 0.9.1-4 for a few days now and it really
rocks, thanks guys ! Now I have a problem that I'm guessing is because
I'm new to Amber and the canvas. I have the model objects all created
for my game application with several example methods (for each class)
that run fine with no errors, but nothing outputs to the Canvas ! I've
looked at all the Amber examples index.html files and tried to pattern
mine from them. From Firefox developer tools I can see that all
necessary .js is being loaded and the halts I insert get sent and when
I inspect my model in the debugger everything is there.

So my questions are: Am I supposed to create a special method that
will be sent to me when the page is loaded (other than whats in
the .html? And does that receiver have to be a subclass of Widget or
can it just use a Widget as a view ?

I have tried a dozen variations of the html based on examples I've
found and this is what it currently looks like:

--------------------------------------------------------------------------------------------------
<html>
<head>
<title>Liars Dice in Amber</title>
<script src="../../js/amber.js" type="text/javascript"></script>
<script type="text/javascript">
loadAmber({
files: ['Dice.js'],
prefix: 'projects/dice/js',
ready: function() {
"smalltalk.TavernDice._example();"
}});
</script>
<script src="../../projects/dice/js/Dice.js" type="text/
javascript"></script>
</head>
<body>
<article>
<h1>Liars Dice in Amber</h1>
<button onclick="smalltalk.TavernDice._example()">TavernDice
example</button>
</article>
</body>
</html>

-------------------------------------------------------------------------------------------------

I am so close and tired of banging my head against a wall. Any
suggestions are very welcome. Thanks in advance.

leonsmith

Re: newbie problem

Ah Ha ! I am calling canvas methods to output things but I never did
add the Widget itself to the canvas root. I'll check it out. Thanks
for the idea.

So do I just send with: to the canvas in the renderOn: method ?

On Jan 19, 8:20 am, "Göran Krampe" <[hidden email]> wrote:

> (on subway)
> Are you in fact somewhere using jQuery to "append" your widgets to the DOM?
> This part is not described that well in our docs/wiki so far I guess.
> regards, Göran-- Sent from my Palm Pre 2, wohoo!On Jan 19, 2012 17:14, leonsmith <[hidden email]> wrote:Hi All, I've been using 0.9.1-4 for a few days now and it really
> rocks, thanks guys ! Now I have a problem that I'm guessing is because
> I'm new to Amber and the canvas. I have the model objects all created
> for my game application with several example methods (for each class)
> that run fine with no errors, but nothing outputs to the Canvas ! I've
> looked at all the Amber examples index.html files and tried to pattern
> mine from them. From Firefox developer tools I can see that all
> necessary .js is being loaded and the halts I insert get sent and when
> I inspect my model in the debugger everything is there.
> So my questions are: Am I supposed to create a special method that
> will be sent to me when the page is loaded (other than whats in
> the .html? And does that receiver have to be a subclass of Widget or
> can it just use a Widget as a view ?
> I have tried a dozen variations of the html based on examples I've
> found and this is what it currently looks like:
> --------------------------------------------------------------------------------------------------
> <html>
> <head>
> <title>Liars Dice in Amber</title>
> <script src="../../js/amber.js" type="text/javascript"></script>
> <script type="text/javascript">
> loadAmber({
> files: ['Dice.js'],
> prefix: 'projects/dice/js',
> ready: function() {
> "smalltalk.TavernDice._example();"
> }});
> </script>
> <script src="../../projects/dice/js/Dice.js" type="text/
> javascript"></script>
> </head>
> <body>
> <article>
> <h1>Liars Dice in Amber</h1>
> <button onclick="smalltalk.TavernDice._example()">TavernDice
> example</button>
> </article>
> </body>
> </html>
> -------------------------------------------------------------------------------------------------
> I am so close and tired of banging my head against a wall. Any
> suggestions are very welcome. Thanks in advance.

leonsmith

Re: newbie problem

bump. Looking at the Counter example I don't see in the Amber code
anywhere where the widgets add themselves to the html DOM. I'll keep
looking later.

On Jan 19, 10:59 am, leonsmith <[hidden email]> wrote:

> Ah Ha ! I am calling canvas methods to output things but I never did
> add the Widget itself to the canvas root. I'll check it out. Thanks
> for the idea.
>
> So do I just send with: to the canvas in the renderOn: method ?
>
> On Jan 19, 8:20 am, "Göran Krampe" <[hidden email]> wrote:
>
>
>
>
>
>
>
> > (on subway)
> > Are you in fact somewhere using jQuery to "append" your widgets to the DOM?
> > This part is not described that well in our docs/wiki so far I guess.
> > regards, Göran-- Sent from my Palm Pre 2, wohoo!On Jan 19, 2012 17:14, leonsmith <[hidden email]> wrote:Hi All, I've been using 0.9.1-4 for a few days now and it really
> > rocks, thanks guys ! Now I have a problem that I'm guessing is because
> > I'm new to Amber and the canvas. I have the model objects all created
> > for my game application with several example methods (for each class)
> > that run fine with no errors, but nothing outputs to the Canvas ! I've
> > looked at all the Amber examples index.html files and tried to pattern
> > mine from them. From Firefox developer tools I can see that all
> > necessary .js is being loaded and the halts I insert get sent and when
> > I inspect my model in the debugger everything is there.
> > So my questions are: Am I supposed to create a special method that
> > will be sent to me when the page is loaded (other than whats in
> > the .html? And does that receiver have to be a subclass of Widget or
> > can it just use a Widget as a view ?
> > I have tried a dozen variations of the html based on examples I've
> > found and this is what it currently looks like:
> > --------------------------------------------------------------------------- -----------------------
> > <html>
> > <head>
> > <title>Liars Dice in Amber</title>
> > <script src="../../js/amber.js" type="text/javascript"></script>
> > <script type="text/javascript">
> > loadAmber({
> > files: ['Dice.js'],
> > prefix: 'projects/dice/js',
> > ready: function() {
> > "smalltalk.TavernDice._example();"
> > }});
> > </script>
> > <script src="../../projects/dice/js/Dice.js" type="text/
> > javascript"></script>
> > </head>
> > <body>
> > <article>
> > <h1>Liars Dice in Amber</h1>
> > <button onclick="smalltalk.TavernDice._example()">TavernDice
> > example</button>
> > </article>
> > </body>
> > </html>
> > --------------------------------------------------------------------------- ----------------------
> > I am so close and tired of banging my head against a wall. Any
> > suggestions are very welcome. Thanks in advance.

gokr

Re: newbie problem

No, it should be added, Nicolas has recently posted how to do it. I don't have the oneliner handy.

regards, Göran

-- Sent from my Palm Pre 2, wohoo!

On Jan 20, 2012 2:41, leonsmith <[hidden email]> wrote:

bump. Looking at the Counter example I don't see in the Amber code
anywhere where the widgets add themselves to the html DOM. I'll keep
looking later.

On Jan 19, 10:59 am, leonsmith <[hidden email]> wrote:

Nicolas Petton

Re: newbie problem

On Fri, 2012-01-20 at 07:22 +0100, Göran Krampe wrote:
> No, it should be added, Nicolas has recently posted how to do it. I
> don't have the oneliner handy.

Hi,

To add a widget to the DOM using jQuery:

MyWidget new appendToJQuery: '#myID' asJQuery

To render nested widgets, using a HTMLCanvas instance:

renderOn: html
html h1 with: 'hello world'.
html with: anotherWidget. "<- nested widget rendered here"

Or you could just do:

renderOn: html
html h1 with: 'hello world'.
anotherWidget renderOn: html

HTH,
nico

leonsmith

Re: newbie problem

Thanks Nico. I am going nowhere fast. I finally gave up trying to get
my project to work and decided to start from the basics and just
create a simple "hello world". There is no such project any more so I
just used what is in the Github Wiki tutorial.

It doesn't come up either ! The only difference to my environment is
cloning the 0.9.1-4 version from github.

I have to take a break and come back to it after a glass of wine :-)

A friend of mine is trying to get me to be the technical advisor to a
new startup and I've been selling Amber to him. Would be nice to
actually show him something :-)

Thanks everyone for all the suggestions.

Leon

On Jan 20, 3:25 am, Nicolas Petton <[hidden email]> wrote:

> On Fri, 2012-01-20 at 07:22 +0100, Göran Krampe wrote:
> > No, it should be added, Nicolas has recently posted how to do it. I
> > don't have the oneliner handy.
>
> Hi,
>
> To add a widget to the DOM using jQuery:
>
> MyWidget new appendToJQuery: '#myID' asJQuery
>
> To render nested widgets, using a HTMLCanvas instance:
>
> renderOn: html
> html h1 with: 'hello world'.
> html with: anotherWidget. "<- nested widget rendered here"
>
> Or you could just do:
>
> renderOn: html
> html h1 with: 'hello world'.
> anotherWidget renderOn: html
>
> HTH,
> nico

Paul DeBruicker

Re: newbie problem

Are there any errors reported in your web browser's development tools
when trying your experiments?

I had a problem with the 'hello world' demo in the docs because I didn't
accurately copy what was written in the docs into the Amber environment
and it wasn't giving any errors in Firebug. My specific problem was
that I had mis-transcribed the last step instead of:

loadAmber({
files: ['HelloApp.js'],
prefix: 'projects/hello/js', // path for js files i think
ready: function() {
$(function() {
smalltalk.Hello._new()._begin();
});
}});

I typed:

loadAmber({
files: ['HelloApp.js'],
prefix: 'projects/hello/js', // path for js files i think
ready: function() {
smalltalk.Hello._new()._begin();
}});

I missed wrapping the 'smalltalk.Hello._new()._begin();' bit in an
anonymous function.....

Maybe you should post what you've got to the list (both HTML and JS for
the not working hello world example) so people can help you with the
specific problem.

Good luck

Paul.

On 12-01-20 03:56 PM, leonsmith wrote:

> Thanks Nico. I am going nowhere fast. I finally gave up trying to get
> my project to work and decided to start from the basics and just
> create a simple "hello world". There is no such project any more so I
> just used what is in the Github Wiki tutorial.
>
> It doesn't come up either ! The only difference to my environment is
> cloning the 0.9.1-4 version from github.
>
> I have to take a break and come back to it after a glass of wine :-)
>
> A friend of mine is trying to get me to be the technical advisor to a
> new startup and I've been selling Amber to him. Would be nice to
> actually show him something :-)
>
> Thanks everyone for all the suggestions.
>
> Leon
>
> On Jan 20, 3:25 am, Nicolas Petton<[hidden email]> wrote:
>> On Fri, 2012-01-20 at 07:22 +0100, Göran Krampe wrote:
>>> No, it should be added, Nicolas has recently posted how to do it. I
>>> don't have the oneliner handy.
>>
>> Hi,
>>
>> To add a widget to the DOM using jQuery:
>>
>> MyWidget new appendToJQuery: '#myID' asJQuery
>>
>> To render nested widgets, using a HTMLCanvas instance:
>>
>> renderOn: html
>> html h1 with: 'hello world'.
>> html with: anotherWidget. "<- nested widget rendered here"
>>
>> Or you could just do:
>>
>> renderOn: html
>> html h1 with: 'hello world'.
>> anotherWidget renderOn: html
>>
>> HTH,
>> nico

leonsmith

Re: newbie problem

Paul,
Thank you, Thank you, Thank you ! If you were here I'd buy you a beer.
That's exactly what I did too. I am an old Smalltalk coder but not all
that experienced with Javascript. I'll read up on anonymous functions.

You started my weekend off on a high note. Now I can kick some butt !

Is anyone else having problems running amber in the latest Chrome
browser ?

Leon (you're never to old to learn new tricks)

On Jan 20, 5:10 pm, Paul DeBruicker <[hidden email]> wrote:

> Are there any errors reported in your web browser's development tools
> when trying your experiments?
>
> I had a problem with the 'hello world' demo in the docs because I didn't
> accurately copy what was written in the docs into the Amber environment
> and it wasn't giving any errors in Firebug. My specific problem was
> that I had mis-transcribed the last step instead of:
>
> loadAmber({
> files: ['HelloApp.js'],
> prefix: 'projects/hello/js', // path for js files i think
> ready: function() {
> $(function() {
> smalltalk.Hello._new()._begin();
> });
>
> }});
>
> I typed:
>
> loadAmber({
> files: ['HelloApp.js'],
> prefix: 'projects/hello/js', // path for js files i think
> ready: function() {
> smalltalk.Hello._new()._begin();
>
> }});
>
> I missed wrapping the 'smalltalk.Hello._new()._begin();' bit in an
> anonymous function.....
>
> Maybe you should post what you've got to the list (both HTML and JS for
> the not working hello world example) so people can help you with the
> specific problem.
>
> Good luck
>
> Paul.
>
> On 12-01-20 03:56 PM, leonsmith wrote:
>
>
>
>
>
>
>
> > Thanks Nico. I am going nowhere fast. I finally gave up trying to get
> > my project to work and decided to start from the basics and just
> > create a simple "hello world". There is no such project any more so I
> > just used what is in the Github Wiki tutorial.
>
> > It doesn't come up either ! The only difference to my environment is
> > cloning the 0.9.1-4 version from github.
>
> > I have to take a break and come back to it after a glass of wine :-)
>
> > A friend of mine is trying to get me to be the technical advisor to a
> > new startup and I've been selling Amber to him. Would be nice to
> > actually show him something :-)
>
> > Thanks everyone for all the suggestions.
>
> > Leon
>
> > On Jan 20, 3:25 am, Nicolas Petton<[hidden email]> wrote:
> >> On Fri, 2012-01-20 at 07:22 +0100, G ran Krampe wrote:
> >>> No, it should be added, Nicolas has recently posted how to do it. I
> >>> don't have the oneliner handy.
>
> >> Hi,
>
> >> To add a widget to the DOM using jQuery:
>
> >> MyWidget new appendToJQuery: '#myID' asJQuery
>
> >> To render nested widgets, using a HTMLCanvas instance:
>
> >> renderOn: html
> >> html h1 with: 'hello world'.
> >> html with: anotherWidget. "<- nested widget rendered here"
>
> >> Or you could just do:
>
> >> renderOn: html
> >> html h1 with: 'hello world'.
> >> anotherWidget renderOn: html
>
> >> HTH,
> >> nico

Paul DeBruicker

Re: newbie problem

On 12-01-21 08:33 AM, leonsmith wrote:
> Paul,
> Thank you, Thank you, Thank you ! If you were here I'd buy you a beer.
> That's exactly what I did too. I am an old Smalltalk coder but not all
> that experienced with Javascript. I'll read up on anonymous functions.
>

I'm glad it fixed it.

I realize I made the mistake because it is/was nonsensical to me that
you'd have to wrap it twice, but that's how it works I guess. I'm sure
there's a very good reason for it and its probably very handy I just
don't have the experience/learning to know why. Yet.

> You started my weekend off on a high note. Now I can kick some butt !
>
> Is anyone else having problems running amber in the latest Chrome
> browser ?

What OS?

Nicolas Petton

Re: newbie problem

In reply to this post by leonsmith

On Sat, 2012-01-21 at 08:33 -0800, leonsmith wrote:
> Is anyone else having problems running amber in the latest Chrome
> browser ?

Nope. What's wrong in the latest chrome? Do you have some JS errors?

Cheers,
Nico

leonsmith

Re: newbie problem

I started disabling plug ins and it works now. I had no idea that
chrome debugger was as goodasit is. Very powerful.

On Jan 21, 8:51 am, Nicolas Petton <[hidden email]> wrote:
> On Sat, 2012-01-21 at 08:33 -0800, leonsmith wrote:
> > Is anyone else having problems running amber in the latest Chrome
> > browser ?
>
> Nope. What's wrong in the latest chrome? Do you have some JS errors?
>
> Cheers,
> Nico