Newbie Question

[Anonymous User]

New to the ArcGIS API for Javascript.  I have been reading and studying a couple of books and code.  Started to write my own application.  I added a couple of basemaps, created a toggle to switch between the two maps (Zoning and aerial photography in our county) and then display parcel outlines on top of Zoning or aerial photography  in either black or yellow depending on the basemap being displayed.  I want to start adding things like a scalebar, TOC, etc. so I read the tutorial on creating your own class and found a couple of really simple examples on the web that would allow me to start adding new functionality into individual javascript files.  One of the examples looks like this:

define('app.sample', [ 'dojo/_base/declare'  ], function(declare) {  return declare({  startup: function() { console.log('I am a defined module'); } }); });

I added one line at the top of this snippet to say:

Console.log(???You are here???);

to ensure that I was getting to this file.  I also changed the first line to read

define(???utils.Sample???, [

as that is where sample.js resides -->??? js/utils/sample.js  I also tried (???utils/Sample???) to no avail.
I then added

???utils/Sample???

to the require statement in my main program and gave it an alias of

???Sample???.  

Finally, inside the callback function I call Sample with the following two lines of code:

var s = new Sample();    s.startup();

That???s it. Seems pretty straight forward but I always see the verbiage ???You are here??? in the console from the top of Sample.js but never the words ???I am a defined module???.  I also tried putting ???dojo/_base/declare??? in my require statement and referencing it as ???declare??? but that didn???t help either.  What am I doing wrong?  The other code snippet is very similar to this one and I can???t get it to work either. Thanks for any feedback.

[UjjwalNarayan1]

works for me if you rename the folders JS to js and Utils to utils. looks like Dojo's amd loader expects folder names to be in the correct case

New to the ArcGIS API for Javascript.  I have been reading and studying a couple of books and code.  Started to write my own application.  I added a couple of basemaps, created a toggle to switch between the two maps (Zoning and aerial photography in our county) and then display parcel outlines on top of Zoning or aerial photography  in either black or yellow depending on the basemap being displayed.  I want to start adding things like a scalebar, TOC, etc. so I read the tutorial on creating your own class and found a couple of really simple examples on the web that would allow me to start adding new functionality into individual javascript files.  One of the examples looks like this:

define('app.sample', [
'dojo/_base/declare' 
], function(declare) { 
return declare({ 
startup: function() {
console.log('I am a defined module');
}
});
});

I added one line at the top of this snippet to say:

Console.log(�??You are here�?�);

to ensure that I was getting to this file.  I also changed the first line to read

define(�??utils.Sample�??, [

as that is where sample.js resides -->�?� js/utils/sample.js  I also tried (�??utils/Sample�??) to no avail.
I then added

�??utils/Sample�?�

to the require statement in my main program and gave it an alias of

�??Sample�?�.  

Finally, inside the callback function I call Sample with the following two lines of code:

var s = new Sample();
   s.startup();

That�??s it. Seems pretty straight forward but I always see the verbiage �??You are here�?� in the console from the top of Sample.js but never the words �??I am a defined module�?�.  I also tried putting �??dojo/_base/declare�?� in my require statement and referencing it as �??declare�?� but that didn�??t help either.  What am I doing wrong?  The other code snippet is very similar to this one and I can�??t get it to work either. Thanks for any feedback.

[Anonymous User]

Ujjwal,

Are you talking about the actual folder names on the server?  If so, I renamed js and utils to all lower-case on the server and still don't see the words "I am a defined module" in the console when I run the application.

[UjjwalNarayan1]

David,

The case sensitive issue might be only applicable to my dev Aptana webserver. And looks like you had a typo in your main.js, you need to add parameters corresponding to the BorderContainer and ContentPane dependencies..

in main.js

(function ()  {
    var map, toggle;
    require([
"dojo/_base/Color",
"dojo/_base/declare",
"dojo/parser",
"esri/config",
"esri/map",
"esri/dijit/BasemapGallery",
"esri/dijit/BasemapToggle",
"esri/dijit/Scalebar", 
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/layers/DynamicLayerInfo",
"esri/layers/ImageParameters",
"esri/layers/LayerDrawingOptions",
"esri/layers/LayerMapSource",
"esri/renderers/SimpleRenderer",
"esri/symbols/SimpleFillSymbol",
"esri/symbols/SimpleLineSymbol",
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane",
"dojo/_base/connect",
"utils/Sample",
"dojo/domReady!"], function(
  Color,
declare,
Parser,
esriConfig,
Map,
BasemapGallery,
  BasemapToggle,
Scalebar,
ArcGISDynamicMapServiceLayer,
DynamicLayerInfo,
ImageParameters,
  LayerDrawingOptions,
LayerMapSource,
SimpleRenderer,
SimpleFillSymbol,
  SimpleLineSymbol,

// Need these two also or Sample will not point to your module!
  BorderContainer,
  ContentPane,

connect,
Sample
) {
Parser.parse();

Ujjwal,

Are you talking about the actual folder names on the server?  If so, I renamed js and utils to all lower-case on the server and still don't see the words "I am a defined module" in the console when I run the application.

[UjjwalNarayan1 · Accepted solution]

Also I am using the following module definition syntax,


define([
'dojo/_base/declare'
    ], function(declare) {
        return declare('utils.sample', [], {
            constructor: function(opts) {
              console.log('Startup constructor'); 
            },
           
            startup: function() {
                console.log('I am a defined module');
            }
        });
});

David,

The case sensitive issue might be only applicable to my dev Aptana webserver. And looks like you had a typo in your main.js, you need to add parameters corresponding to the BorderContainer and ContentPane dependencies..

in main.js

(function ()  {
    var map, toggle;
    require([
"dojo/_base/Color",
"dojo/_base/declare",
"dojo/parser",
"esri/config",
"esri/map",
"esri/dijit/BasemapGallery",
"esri/dijit/BasemapToggle",
"esri/dijit/Scalebar", 
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/layers/DynamicLayerInfo",
"esri/layers/ImageParameters",
"esri/layers/LayerDrawingOptions",
"esri/layers/LayerMapSource",
"esri/renderers/SimpleRenderer",
"esri/symbols/SimpleFillSymbol",
"esri/symbols/SimpleLineSymbol",
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane",
"dojo/_base/connect",
"utils/Sample",
"dojo/domReady!"], function(
  Color,
declare,
Parser,
esriConfig,
Map,
BasemapGallery,
  BasemapToggle,
Scalebar,
ArcGISDynamicMapServiceLayer,
DynamicLayerInfo,
ImageParameters,
  LayerDrawingOptions,
LayerMapSource,
SimpleRenderer,
SimpleFillSymbol,
  SimpleLineSymbol,

// Need these two also or Sample will not point to your module!
  BorderContainer,
  ContentPane,

connect,
Sample
) {
Parser.parse();

[Anonymous User]

Ujjwal,

Giving aliases to BorderContainer and ContentPane produced error messages.  I recall adding those digits to try out some functionality that I couldn't get to work if I gave these two digits aliases.  Anyway, I got rid of those two lines in the require staement and substituted your code for my code in Sample.js and it worked!  Great.  I'm not exactly sure why your code works and mine doesn't but I should be able to move on now anyway.  I'll mark the post as answered but if you don't get the credit you deserve, please let me know.  Thanks again.  Take care.

[UjjwalNarayan1]

Thanks David, as far as i know the module name ("app.sample") should be set as the first param in the declare function rather than in the define function.. that was the major change i made to your module definition

http://dojotoolkit.org/reference-guide/1.9/dojo/_base/declare.html