Problem setting up Tide demo

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

Problem setting up Tide demo

in_pharo_users
Hi Esteban,

after I got Amber running separately, I set up Tide according to

   https://github.com/tide-framework/tide ; readme.md

Everything went fine so far, but after the page loaded, Helios did not pop. Blank page.

So I looked into the page source and,  suspiciously, at line 18 I found

****
  require(
        [
  		"amber/devel", 
  		"amber/helpers",
  		"tide/Tide-Amber-Core",
  		"tide/Tide-Amber-Exceptions",
  		"tide/Tide-Amber-Examples",
  		"tide/Tide-Amber-Tests"
  	],
        function (smalltalk) {
            smalltalk.initialize({defaultAmdNamespace: 'tide'});
            smalltalk.popupHelios();
        }
****

I searched for all required paths in the bower path, but could not find only the first two.

Can you kindly give me a hint how to proceed to get it running?

Kind regards,

basket







 
Reply | Threaded
Open this post in threaded view
|

Re: Problem setting up Tide demo

EstebanLM
hi, 

no idea :)
as I said this is more a matter for Amber list than Pharo. 

but amber maintainer (Herbert) hangs here so he will probably reply if he sees this :P

Esteban

On 21 Mar 2018, at 21:42, [hidden email] wrote:

Hi Esteban,

after I got Amber running separately, I set up Tide according to

   https://github.com/tide-framework/tide ; readme.md

Everything went fine so far, but after the page loaded, Helios did not pop. Blank page.

So I looked into the page source and,  suspiciously, at line 18 I found

****
  require(
        [
  		"amber/devel", 
  		"amber/helpers",
  		"tide/Tide-Amber-Core",
  		"tide/Tide-Amber-Exceptions",
  		"tide/Tide-Amber-Examples",
  		"tide/Tide-Amber-Tests"
  	],
        function (smalltalk) {
            smalltalk.initialize({defaultAmdNamespace: 'tide'});
            smalltalk.popupHelios();
        }
****

I searched for all required paths in the bower path, but could not find only the first two.

Can you kindly give me a hint how to proceed to get it running?

Kind regards,

basket







 

Reply | Threaded
Open this post in threaded view
|

Re: Problem setting up Tide demo

Herby Vojčík
In reply to this post by in_pharo_users
In newer version of Amber the loading code changed significantly, as
promises are used (best way to migrate old code is to actually created
new project using `amber init` and only move the needed pieces (src/*.st
files, .amd.json files, lists of packages in deploy.js / testing.js /
devel.js / Gruntfile.js) to the new structure).

Also "searched in bower path" is wrong, paths are mapped differently,
using .amd.json files (which I think are set correctly), but of course,
`grunt devel` must be run at least once for mapping to happen (it is run
as part of `amber init`, so new project is set up fine; but in case
.amd.json files are changed, it should be rerun).

Herby

[hidden email] wrote:

> Hi Esteban,
>
> after I got Amber running separately, I set up Tide according to
>
> https://github.com/tide-framework/tide
> <https://github.com/tide-framework/tide >; readme.md
>
> Everything went fine so far, but after the page loaded, Helios did not
> pop. Blank page.
>
> So I looked into the page source and, suspiciously, at line 18 I found
>
> ****
>
>    require(
>          [
>     "amber/devel",
>     "amber/helpers",
>     "tide/Tide-Amber-Core",
>     "tide/Tide-Amber-Exceptions",
>     "tide/Tide-Amber-Examples",
>     "tide/Tide-Amber-Tests"
>     ],
>          function (smalltalk) {
>              smalltalk.initialize({defaultAmdNamespace: 'tide'});
>              smalltalk.popupHelios();
>          }
> ****
>
> I searched for all required paths in the bower path, but could not find only the first two.
>
> Can you kindly give me a hint how to proceed to get it running?
>
> Kind regards,
>
> basket
>
>
>
>
>
>
>
>
>

Reply | Threaded
Open this post in threaded view
|

Re: Problem setting up Tide demo

in_pharo_users
Hi Esteban, hi Herbert,

so, formally,  it is a Tide integration issue now, IMHO.

As I understand it now:

Tide's setup procedure generates a file system out of a Monticello archive
and puts Tide related extensions for Amber in it.  Then the user is directed to that fs's root
to install Amber. (That seems a little odd, as these extensions are to be integrated
in the Amber image and seem to have a stonger adhesion there.)

The part of the procedure  to install Tide is now invalid relating to Amber.

Should I try the following:

***

I have a brand new allmost perfectly working Amber installation.

I scavenge the elements mentioned by Herbert below and move them to the Tide stub,
instead of using the Tide/Monticello generated 'bower install' script.
Then run 'grunt devel'.
Is this all I need?

Is there a way to explicitly describe the objects I need?
Or is there a way to check what exactly is missing?

***

But would it not be a better approach to update the Tide setup procedure?
How would that work?


Kind regards,

basket



On 21.3.2018 at 9:54 PM, "Herbert Vojčík" <[hidden email]> wrote:
In newer version of Amber the loading code changed significantly, as
promises are used (best way to migrate old code is to actually created
new project using `amber init` and only move the needed pieces (src/*.st
files, .amd.json files, lists of packages in deploy.js / testing.js /
devel.js / Gruntfile.js) to the new structure).

Also "searched in bower path" is wrong, paths are mapped differently,
using .amd.json files (which I think are set correctly), but of course,
`grunt devel` must be run at least once for mapping to happen (it is run
as part of `amber init`, so new project is set up fine; but in case
.amd.json files are changed, it should be rerun).

Herby

[hidden email] wrote:

> Hi Esteban,
>
> after I got Amber running separately, I set up Tide according to
>
> https://github.com/tide-framework/tide
> <https://github.com/tide-framework/tide >; readme.md
>
> Everything went fine so far, but after the page loaded, Helios did not
> pop. Blank page.
>
> So I looked into the page source and, suspiciously, at line 18 I found
>
> ****
>
> require(
> [
> "amber/devel",
> "amber/helpers",
> "tide/Tide-Amber-Core",
> "tide/Tide-Amber-Exceptions",
> "tide/Tide-Amber-Examples",
> "tide/Tide-Amber-Tests"
> ],
> function (smalltalk) {
> smalltalk.initialize({defaultAmdNamespace: 'tide'});
> smalltalk.popupHelios();
> }
> ****
>
> I searched for all required paths in the bower path, but could not find only the first two.
>
> Can you kindly give me a hint how to proceed to get it running?
>
> Kind regards,
>
> basket
>
Reply | Threaded
Open this post in threaded view
|

Re: Problem setting up Tide demo

Herby Vojčík


On March 21, 2018 11:18:42 PM GMT+01:00, [hidden email] wrote:

>Hi Esteban, hi Herbert,
>
>so, formally,  it is a Tide integration issue now, IMHO.
>
>As I understand it now:
>
>Tide's setup procedure generates a file system out of a Monticello
>archive
>and puts Tide related extensions for Amber in it.  Then the user is
>directed to that fs's root
>to install Amber. (That seems a little odd, as these extensions are to
>be integrated
>in the Amber image and seem to have a stonger adhesion there.)
>
>The part of the procedure  to install Tide is now invalid relating to
>Amber.
>
>Should I try the following:
>
>***
>
>I have a brand new allmost perfectly working Amber installation.
>
>I scavenge the elements mentioned by Herbert below and move them to
>the Tide stub,
>instead of using the Tide/Monticello generated 'bower install' script.

No, if Tide's approach is to generate a skeleton which only needs to get dependencies, then it is very reasonable approach indeed.

The 'amber init' command actually does the same: fills fs from template then runs 'npm install' to get tooling, 'bower install' to get project dependencies, including amber itself, 'grunt' to compile .st files into .js files and 'grunt devel' to set up environment to development mode loader.

'That seems a little odd, as these extensions are to be integrated
in the Amber image' not odd at all as there is no true image - that whole filetree is 'the source for the image build' and actual 'image' only exists at runtime by loading all components into memory. Amber is just another library to load.

So if tide indeed fills fs with all the needed pieces so it then only needs a few 'load deps' steps, then make it work by hand, then simply remove all transient pieces (node_modules/, bower_components/, config.js, src/*.js) and you have nice new state in which it should all start.

You should then update the old tide seed file tree with the new updated one.

>Then run 'grunt devel'.
>Is this all I need?
>
>Is there a way to explicitly describe the objects I need?
>Or is there a way to check what exactly is missing?
>
>***
>
>But would it not be a better approach to update the Tide setup
>procedure?
>How would that work?
>Kind regards,
>
>basket
>On 21.3.2018 at 9:54 PM, "Herbert Vojčík"  wrote:In newer version of
>Amber the loading code changed significantly, as
>promises are used (best way to migrate old code is to actually created
>
>new project using `amber init` and only move the needed pieces
>(src/*.st
>files, .amd.json files, lists of packages in deploy.js / testing.js /
>devel.js / Gruntfile.js) to the new structure).
>
>Also "searched in bower path" is wrong, paths are mapped differently,
>using .amd.json files (which I think are set correctly), but of
>course,
>`grunt devel` must be run at least once for mapping to happen (it is
>run
>as part of `amber init`, so new project is set up fine; but in case
>.amd.json files are changed, it should be rerun).
>
>Herby
>
>[hidden email] wrote:
>> Hi Esteban,
>>
>> after I got Amber running separately, I set up Tide according to
>>
>> https://github.com/tide-framework/tide
>> ; readme.md
>>
>> Everything went fine so far, but after the page loaded, Helios did
>not
>> pop. Blank page.
>>
>> So I looked into the page source and, suspiciously, at line 18 I
>found
>>
>> ****
>>
>>    require(
>>          [
>>     "amber/devel",
>>     "amber/helpers",
>>     "tide/Tide-Amber-Core",
>>     "tide/Tide-Amber-Exceptions",
>>     "tide/Tide-Amber-Examples",
>>     "tide/Tide-Amber-Tests"
>>     ],
>>          function (smalltalk) {
>>              smalltalk.initialize({defaultAmdNamespace: 'tide'});
>>              smalltalk.popupHelios();
>>          }
>> ****
>>
>> I searched for all required paths in the bower path, but could not
>find only the first two.
>>
>> Can you kindly give me a hint how to proceed to get it running?
>>
>> Kind regards,
>>
>> basket
>>

Reply | Threaded
Open this post in threaded view
|

Re: Problem setting up Tide demo - pls. Instructions for manual labor, identify culprit?

in_pharo_users
Hi Esteban, hi Herbert,

On 22.3.2018 at 12:07 AM, [hidden email] wrote:
> [...]
> So if tide indeed fills fs with all the needed pieces so it then only needs a few 'load deps' steps, then
> make it work by hand, then
^^^^^^^^^^^^^^^^^^^^^^^^^^
> simply remove all transient pieces (node_modules/, bower_components/, config.js, src/*.js) and you have nice new state
> in which it should all start.

I would really like to.  But how can I even identify what is needed or missing?

I do know little bout the inner workings of Amber.

I can only see that I cannot find some Amber side components used by Tide's demo page.

I do not even know if these still exist in the newest Amber tags, or need to be replaced or reconstructed...

************
--> Can you give me a direction of how to make it work by hand?
************


The only way I could emagine from my state of knowledge would be to integrate the existing Amber
side Tide components into a new Amber instance, modifying them along the way according to possible
changes in Amber.  Quite a tedious approach, especially as nothing Tide-ish is supposed to be working at start.


> You should then update the old tide seed file tree with the new updated one.

I would really prefer to use the original working configuration as a base line
initially and then go for subsequent Amber and Pharo updates.

When I follow the Tide installation instructions, the result should be a working base line but it does not work.

Who is the culprit? 

Is there an error in Tide, esp. the demo page,
is the Tide seed file tree etc. kaputt, or
does bower deliver a wrong configuration (possibly result of the move from git to LOL) or
something else?

************
Is there a way  to restore the configuration that Tide requests?
Or is Tide in an inconsitent state?
Why does it not work?
************







On 22.3.2018 at 12:07 AM, [hidden email] wrote:
On March 21, 2018 11:18:42 PM GMT+01:00, [hidden email] wrote:

>Hi Esteban, hi Herbert,
>
>so, formally, it is a Tide integration issue now, IMHO.
>
>As I understand it now:
>
>Tide's setup procedure generates a file system out of a Monticello
>archive
>and puts Tide related extensions for Amber in it. Then the user is
>directed to that fs's root
>to install Amber. (That seems a little odd, as these extensions are to
>be integrated
>in the Amber image and seem to have a stonger adhesion there.)
>
>The part of the procedure to install Tide is now invalid relating to
>Amber.
>
>Should I try the following:
>
>***
>
>I have a brand new allmost perfectly working Amber installation.
>
>I scavenge the elements mentioned by Herbert below and move them to
>the Tide stub,
>instead of using the Tide/Monticello generated 'bower install' script.

No, if Tide's approach is to generate a skeleton which only needs to get dependencies, then it is very reasonable approach indeed.

The 'amber init' command actually does the same: fills fs from template then runs 'npm install' to get tooling, 'bower install' to get project dependencies, including amber itself, 'grunt' to compile .st files into .js files and 'grunt devel' to set up environment to development mode loader.

'That seems a little odd, as these extensions are to be integrated
in the Amber image' not odd at all as there is no true image - that whole filetree is 'the source for the image build' and actual 'image' only exists at runtime by loading all components into memory. Amber is just another library to load.

So if tide indeed fills fs with all the needed pieces so it then only needs a few 'load deps' steps, then make it work by hand, then simply remove all transient pieces (node_modules/, bower_components/, config.js, src/*.js) and you have nice new state in which it should all start.

You should then update the old tide seed file tree with the new updated one.

>Then run 'grunt devel'.
>Is this all I need?
>
>Is there a way to explicitly describe the objects I need?
>Or is there a way to check what exactly is missing?
>
>***
>
>But would it not be a better approach to update the Tide setup
>procedure?
>How would that work?
>Kind regards,
>
>basket
>On 21.3.2018 at 9:54 PM, "Herbert Vojčík" wrote:In newer version of
>Amber the loading code changed significantly, as
>promises are used (best way to migrate old code is to actually created
>
>new project using `amber init` and only move the needed pieces
>(src/*.st
>files, .amd.json files, lists of packages in deploy.js / testing.js /
>devel.js / Gruntfile.js) to the new structure).
>
>Also "searched in bower path" is wrong, paths are mapped differently,
>using .amd.json files (which I think are set correctly), but of
>course,
>`grunt devel` must be run at least once for mapping to happen (it is
>run
>as part of `amber init`, so new project is set up fine; but in case
>.amd.json files are changed, it should be rerun).
>
>Herby
>
>[hidden email] wrote:
>> Hi Esteban,
>>
>> after I got Amber running separately, I set up Tide according to
>>
>> https://github.com/tide-framework/tide
>> ; readme.md
>>
>> Everything went fine so far, but after the page loaded, Helios did
>not
>> pop. Blank page.
>>
>> So I looked into the page source and, suspiciously, at line 18 I
>found
>>
>> ****
>>
>> require(
>> [
>> "amber/devel",
>> "amber/helpers",
>> "tide/Tide-Amber-Core",
>> "tide/Tide-Amber-Exceptions",
>> "tide/Tide-Amber-Examples",
>> "tide/Tide-Amber-Tests"
>> ],
>> function (smalltalk) {
>> smalltalk.initialize({defaultAmdNamespace: 'tide'});
>> smalltalk.popupHelios();
>> }
>> ****
>>
>> I searched for all required paths in the bower path, but could not
>find only the first two.
>>
>> Can you kindly give me a hint how to proceed to get it running?
>>
>> Kind regards,
>>
>> basket
>>
Reply | Threaded
Open this post in threaded view
|

Re: Problem setting up Tide demo - pls. Instructions for manual labor, identify culprit?

Herby Vojčík
Well, this probably needs talking.

Best approach to running with current Amber is indeed "use new project.
move old source by hand". In fact, it is not that bad as it looks, as
many things work as they should.

But if anything does not, it would need an exchange of errors from
console, current state of files etc. to pinpoint it.

Why didn't you join the amber chat, that would be ideal platform to
clear things up one issue at a time?

Re: I would like to start from tide ... if it contains old code, it
would probably be better to replace its seed with new working one. IMNSHO.

Actually. Amber is just a library accompanied with tools to ease its
integration (`amber init`, `grunt devel`, etc.) but in pronciple, it is
just an AMD library, so if you are familiar with JS ecosystem, you could
just look into index.html, Gruntfile.js and a few other places maybe to
get how it is stitched together (and understand what the tide
configuration wanted to achieve). I actually don't know what was tide's
approach, but I hope it did not try to deviate very much from the
"canonical" way project was structured by `amber init` at the time - the
"problem" is, this configuration/setup thing has changed since. If it
actually generates "pre-setup" project of its own (tailored to how
things were back then), it would be best as I already told to make it
produce modern version of the same. But I don't know if that is the case.`fg

Nevertheless, this is probably better solved in chat by exchanging error
outputs etc. and finding what's wrong.

But, I would repeat, I'd go for "start from new project, move tide into
it". From what you posted so far, it seems the only files that are owned
by project are a few tide packages in "tide" namespace; otherwise
everything else is a dependency.

So move .st files into new project, update Gruntfile.js to properly list
them in all needed places, run `grunt` to compile, and index.html should
be loadable including everything. If something's wrong, either `grunt`
spews some error, or the browser console has them when loading fails.

Herby

[hidden email] wrote:

> Hi Esteban, hi Herbert,
>
> On 22.3.2018 at 12:07 AM, [hidden email] wrote:
>>  [...]
>>  So if tide indeed fills fs with all the needed pieces so it then only
> needs a few 'load deps' steps, then
>>  make it work by hand, then
> ^^^^^^^^^^^^^^^^^^^^^^^^^^
>>  simply remove all transient pieces (node_modules/, bower_components/,
> config.js, src/*.js) and you have nice new state
>>  in which it should all start.
>
> I would really like to. But how can I even identify what is needed or
> missing?
>
> I do know little bout the inner workings of Amber.
>
> I can only see that I cannot find some Amber side components used by
> Tide's demo page.
>
> I do not even know if these still exist in the newest Amber tags, or
> need to be replaced or reconstructed...
>
> ************
> --> Can you give me a direction of how to make it work by hand?
> ************
>
>
> The only way I could emagine from my state of knowledge would be to
> integrate the existing Amber
> side Tide components into a new Amber instance, modifying them along the
> way according to possible
> changes in Amber. Quite a tedious approach, especially as nothing
> Tide-ish is supposed to be working at start.
>
>
>>  You should then update the old tide seed file tree with the new
> updated one.
>
> I would really prefer to use the original working configuration as a
> base line
> initially and then go for subsequent Amber and Pharo updates.
>
> When I follow the Tide installation instructions, the result should be a
> working base line but it does not work.
>
> Who is the culprit?
>
> Is there an error in Tide, esp. the demo page,
> is the Tide seed file tree etc. kaputt, or
> does bower deliver a wrong configuration (possibly result of the move
> from git to LOL) or
> something else?
>
> ************
> Is there a way to restore the configuration that Tide requests?
> Or is Tide in an inconsitent state?
> Why does it not work?
> ************
>
>
>
>
>
>
>
> On 22.3.2018 at 12:07 AM, [hidden email] wrote:
>
>     On March 21, 2018 11:18:42 PM GMT+01:00, [hidden email]
>     wrote:
>     >Hi Esteban, hi Herbert,
>     >
>     >so, formally, it is a Tide integration issue now, IMHO.
>     >
>     >As I understand it now:
>     >
>     >Tide's setup procedure generates a file system out of a Monticello
>     >archive
>     >and puts Tide related extensions for Amber in it. Then the user is
>     >directed to that fs's root
>     >to install Amber. (That seems a little odd, as these extensions are to
>     >be integrated
>     >in the Amber image and seem to have a stonger adhesion there.)
>     >
>     >The part of the procedure to install Tide is now invalid relating to
>     >Amber.
>     >
>     >Should I try the following:
>     >
>     >***
>     >
>     >I have a brand new allmost perfectly working Amber installation.
>     >
>     >I scavenge the elements mentioned by Herbert below and move them to
>     >the Tide stub,
>     >instead of using the Tide/Monticello generated 'bower install' script.
>
>     No, if Tide's approach is to generate a skeleton which only needs to
>     get dependencies, then it is very reasonable approach indeed.
>
>     The 'amber init' command actually does the same: fills fs from
>     template then runs 'npm install' to get tooling, 'bower install' to
>     get project dependencies, including amber itself, 'grunt' to compile
>     .st files into .js files and 'grunt devel' to set up environment to
>     development mode loader.
>
>     'That seems a little odd, as these extensions are to be integrated
>     in the Amber image' not odd at all as there is no true image - that
>     whole filetree is 'the source for the image build' and actual
>     'image' only exists at runtime by loading all components into
>     memory. Amber is just another library to load.
>
>     So if tide indeed fills fs with all the needed pieces so it then
>     only needs a few 'load deps' steps, then make it work by hand, then
>     simply remove all transient pieces (node_modules/,
>     bower_components/, config.js, src/*.js) and you have nice new state
>     in which it should all start.
>
>     You should then update the old tide seed file tree with the new
>     updated one.
>
>     >Then run 'grunt devel'.
>     >Is this all I need?
>     >
>     >Is there a way to explicitly describe the objects I need?
>     >Or is there a way to check what exactly is missing?
>     >
>     >***
>     >
>     >But would it not be a better approach to update the Tide setup
>     >procedure?
>     >How would that work?
>     >Kind regards,
>     >
>     >basket
>     >On 21.3.2018 at 9:54 PM, "Herbert Vojčík" wrote:In newer version of
>     >Amber the loading code changed significantly, as
>     >promises are used (best way to migrate old code is to actually created
>     >
>     >new project using `amber init` and only move the needed pieces
>     >(src/*.st
>     >files, .amd.json files, lists of packages in deploy.js / testing.js /
>     >devel.js / Gruntfile.js) to the new structure).
>     >
>     >Also "searched in bower path" is wrong, paths are mapped differently,
>     >using .amd.json files (which I think are set correctly), but of
>     >course,
>     >`grunt devel` must be run at least once for mapping to happen (it is
>     >run
>     >as part of `amber init`, so new project is set up fine; but in case
>     >.amd.json files are changed, it should be rerun).
>     >
>     >Herby
>     >
>     >[hidden email] wrote:
>     > > Hi Esteban,
>     > >
>     > > after I got Amber running separately, I set up Tide according to
>     > >
>     > > https://github.com/tide-framework/tide
>     > > ; readme.md
>     > >
>     > > Everything went fine so far, but after the page loaded, Helios did
>     >not
>     > > pop. Blank page.
>     > >
>     > > So I looked into the page source and, suspiciously, at line 18 I
>     >found
>     > >
>     > > ****
>     > >
>     > > require(
>     > > [
>     > > "amber/devel",
>     > > "amber/helpers",
>     > > "tide/Tide-Amber-Core",
>     > > "tide/Tide-Amber-Exceptions",
>     > > "tide/Tide-Amber-Examples",
>     > > "tide/Tide-Amber-Tests"
>     > > ],
>     > > function (smalltalk) {
>     > > smalltalk.initialize({defaultAmdNamespace: 'tide'});
>     > > smalltalk.popupHelios();
>     > > }
>     > > ****
>     > >
>     > > I searched for all required paths in the bower path, but could not
>     >find only the first two.
>     > >
>     > > Can you kindly give me a hint how to proceed to get it running?
>     > >
>     > > Kind regards,
>     > >
>     > > basket
>     > >
>