enhance appearance of samples about angular-esri-map HOT 4 CLOSED

I agree.

My original idea was to have the following folder structure:

• app: a nice looking app w/ some demos (the gh-pages site) that would have routing, bootstrap, etc.
• examples: single page bare-bones examples that have no clutter (bootstrap, etc) so developers can clearly see the controller and view code all in one place for each feature
• dist: the distributable files the people can install into their own apps via bower

The problem is that's a lot of duplication of the code. For each sample, you'd have to write an example page, and then a controller and view for the app.

One idea is to keep the individual pages, but add bootstrap to all of them just to make them look better. The problem w/ that is that the pages won't have the common navigation, etc, or we'd have to add and maintain that in each.

Another idea is to do away w/ the individual pages and replace them w/ routes/controllers/views in the app. I'm fine w/ that, but I think it would be good to group view/controller files in the same folder by route:

app
    simple-map
        SimpleMapCtrl.js
        SimpleMapView.html
    web-map
        WebMapCtrl.js
        WebMapView.html

That way devs aren't bouncing around between app/controllers and app/views to see what's going on.

from angular-esri-map.

Keep in mind that if we use bootstrap we'll need my overrides in bootstrapmap.css to circumvent css conflicts. bootstrapmap.css can be used without bootstrapmap.js.

from angular-esri-map.

FYI - as part of my testing for #7, I updated esri-angular-js as follows:

• I removed all the directives, and add this repo as a dependency via bower
• updated the controllers/views to use the directives from this repo and got the app working, which you can see here: http://tomwayson.github.io/esri-angular-js
• updated README so it says that repo is deprecated and points users here

This shows the directives working both in another repo loaded from bower, and also in a bootstrap app. I forgot to add @alaframboise's css, but it still works - I think b/c the examples are so simple and don't have popups, etc.

Ultimately, I'll probably delete that repo since @jabadia and I have the only forks, but I just wanted to show the directives from this repo working in a bootstrap app since it was already set up.

from angular-esri-map.

So here's my idea about how we could structure (i.e. routes) the gh-pages app:

#/ - jumbotron and a brief intro to the module
#/quick-start - and live map w/ feat. layers and code snippet (like http://esri.github.io/bootstrap-map-js/demo/jquery/getstarted.html)
#/examples - the list of links to and descriptions of the example pages (i.e. the middle section of http://esri.github.io/angular-esri-map/)
#/examples/[example-name] - each individual example
#/about - the "Zen" section from http://esri.github.io/angular-esri-map/

I will do a first pass of that this weekend so we have something a little more attractive to show at next weeks' meeting. Let me know if there's something I missed or if you have other thoughts on the structure.

from angular-esri-map.