Require JS file/directory structure

Why do we do:
  <script type='text/javascript' src='.../require.min.js'></script>  <script type='text/javascript' src='.../amber.js'></script>And include the require.config and require in index.html?

Require JS's example shows simply:
  <script data-main="app" src="scripts/require.js"></script>where app.js is:
  requirejs.config(...);
  requirejs(['app/main']);
and main.js is "define(function (require) {...});

I see that amber 0.13 seems to be heading in this direction with:
  <script type='text/javascript' src='.../require.min.js'></script>  <script type='text/javascript' src='config.js'></script>But the "require([...], function(){...});" is still in index.html

Some parts seem to be missing from your post.

Sean P. DeNigris wrote:
--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
For more options, visit https://groups.google.com/d/optout.

I think you can do it if you wish.

I don't use it because:
 - IMO you can have more pages where you may load things slightly differently
 - data-main is asynchronous, whatever you do later does not wait for it

So it seems to me being a bit more explicit than implicit does not hurt.

Also, I always try to think of amber as "a library to use", IOW, I try not to be overly app-centric, so by being explicit in the way it is used instead of using data-main one-js-to-load-them-all approach I seem to being more open (the way it is loaded can be tweaked directly, you see in index.html yourself).

Sean P. DeNigris wrote: ain']);
--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
For more options, visit https://groups.google.com/d/optout.

Herby Vojčík wrote

you can have more pages where you may load things slightly differently

That is actually something I've been wondering about. I have three simple use cases for index.html:
1. Dev - require amber/devel, button to open Helios
2. Debug - same as Dev, but launch app from inside setTimeout after Helios is running, so that debuggers will open in Helios
3. Deploy require amber/deploy and remove dev features from #1 and #2

The index.html is 99% the same for all three. What's the best way to efficiently manage these small differences?

Only use debug and deploy and use smart guess to distinguish them (var isDev = window.location.host === "localhost" || window.location.host === "127.0.0.1")?

"Sean P. DeNigris" <[hidden email]>napísal/a:

--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
For more options, visit https://groups.google.com/d/optout.

On Jul 27, 2014, at 1:23 PM, Herby Vojčík [via Smalltalk] <[hidden email]> wrote:
> Only use debug and deploy and use smart guess to distinguish them (var isDev = window.location.host === "localhost" || window.location.host === "127.0.0.1")?

I guess you mean something like:
var isDev = window.location.host === "localhost" || window.location.host === "127.0.0.1";
var amberPackage = isDev ? "amber/devel" : "amber/deploy";
require([amberPackage, 'lib/jstree', 'lib/pathjs']…

I could also make the “Open Helios” button tag from JS based on isDev instead of in the html directly.

But I don’t see how to auto-detect the debug case, which I only want to use in special cases like when I need to debug ST code, because waiting a few seconds for Helios to load every time in dev mode is a drag. And if I have an index.html and index-debug.html, what I’m trying to get at is how to separate the required packages from the logic of a particular page and avoid duplication...

Also, how would one choose between (for dev):
    <script type='text/javascript' src='bower_components/amber/support/requirejs/require.min.js'></script>
    <script type='text/javascript' src='config.js'></script>
and (for deploy):
    <script type='text/javascript' src='all-in-1.js'></script>
... from inside JS. Doesn't this choice have to happen before we execute our JS?

Finally, what continues to bother me is the duplication between
  app.build.js:
    include: [ 'amber/deploy',
          'ns/MyPackage',
          'ns/MyOtherPackage',
          'lib/jstree',
          'lib/pathjs',
          'lib/jquery-migrate',
          'lib/splitter' ]
and
  index.html:
    require([ 'amber/deploy',
          'ns/MyPackage',
          'ns/MyOtherPackage',
          'lib/jstree',
          'lib/pathjs',
          'lib/jquery-migrate',
          'lib/splitter' ].
Can this array be created somewhere else and passed into both these places?

Forgive my total lack of web/JS knowledge and if these are non-Amber-specific problems, let me know what to google or if you know of a good reference. Thanks.

Sean P. DeNigris wrote: I would directly inline the amberPackage expression here.

I thought about it a few days already, and I thought this kind of simple
smart guess can actually be by default in amber init-created projects,
so if you wish, you can just include a PR with working version
(grunt-init-amber repo, root/index.html file).

> I could also make the “Open Helios” button tag from JS based on isDev
> instead of in the html directly.
>
> But I don’t see how to auto-detect the debug case, which I only want to
> use in special cases like when I need to debug ST code, because waiting

No need to use it in special cases, you want it always when you develop.
You want IDE in one window and your app in another, which it does.

> a few seconds for Helios to load every time in dev mode is a drag. And

You can detect if it helios is loaded by checking if it registered its
debug handler, for example; periodcally each 200ms or so.

Load all-in-1.js, put a <script> after it checking for existence of
require and define and check if define.amd is truish; if passed, you
know it has loaded, if no, include other two <script>s dynamically -
document.create("script"), .src=....; ....appendChild - look at
index.html in helios to see the similar pattern (they really don't care
in which order are they loaded, they play fine in both ways, so you can
just include both of them without syncing them).

No, afaict, and it would make it awkward. OTOH, if you think you have
too long list, you can always make you own set (.js with just the define
call, just like amber/deploy is for an example) and include that set in
require as well as in app.build.js. I would only include the rest, not
the amber set there, so both require array and app.build.js include
array would have two elements.

> Forgive my total lack of web/JS knowledge and if these are
> non-Amber-specific problems, let me know what to google or if you know
> of a good reference. Thanks.

They mostly are, it's about requirejs. Well, requirejs docs.

> Cheers,
> Sean

Herby

--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
For more options, visit https://groups.google.com/d/optout.