agrc / agrc.widgets

agrc's widgets

AGRC Dojo Widgets

Projects that still use this library

• https://github.com/agrc/deq-spills

Getting Started

1. Clone the repo
2. npm install && bower install && grunt

You can use our widgets just like any other Dojo widget. Just be sure to set your packages loader config property so that Dojo knows where to look.

Sample

require({
  packages: [{
    name: 'agrc',
    location: '../agrc.widgets'
  }]
}, [
  'esri/map',
  'esri/layers/ArcGISTiledMapServiceLayer',

  'agrc/widgets/locate/FindAddress'
], function (
Map,
Tiled,

FindAddress
) {
  var serviceUrl = 'http://mapserv.utah.gov/arcgis/rest/services/BaseMaps/Terrain/MapServer';
  var map = new Map('map-div');

  var tiledService = new Tiled(serviceUrl);

  map.addLayer(tiledService);

  var findAddress = new FindAddress({
    map: map,
    apiKey: 'get your key at http://developer.mapserv.utah.gov'
  }, 'find-address');
});

Browser Compatibility

We support the same browsers that ESRI's API does.

agrc.widgets's Issues

BaseMap Loader Should Use `spin.js`

It's already in this project since #17. I think that it would look a lot better than the ugly gif that we have now.

SpecTRSsearch specs are failing in travis

ZoomToCoords: It won't allow you to input decimal places in longitude degree values

This is because Math.abs('1.') returns 1. Ref:

agrc.widgets/widgets/locate/ZoomToCoords.js

Line 364 in 563e33d

event.target.value = Math.abs(event.target.value);

BaseMap router spatial reference

the basemap router always creates a point with the 26912 spatial reference. The point is created before the map is loaded so you can't get the spatial reference from the layers. You could get the spatialReference from the extent which gets set in the constructor if you moved the router init call below the default extent initialization.

Zoom to Coords: Add more descriptive messages for common mistakes

Such as switched lat/longs.

HTTPS URL's

Need to dynamically adjust all urls to use https if the current app does. Could use same code as google analytics does:

src = 'https:' == document.location.protocol ? 'https://ssl' : 'http://www'

Documentation

I would like to give our widgets some documentation. I think they deserve it. I think the dojo doc parser is horrible and would like to try something pretty, like docco.

I like the way it mixes code with the documentation side by side and it would be a good fit.

It could make a good gh-pages branch then as well.

BaseMap Buttons

They don't match the new small slider style.

CDN

Need to figure out how to automatically update the cdn that's referenced in this article: http://gis.utah.gov/agrc-web-mapping-services-demo/. Maybe something with gh-pages branch?

travis

grunt-bump

https://github.com/vojtajina/grunt-bump

Router for BaseMapSelector widget

Add a router parameter similar to BaseMap that persists the currently selected base map as a URL parameter.

Add AMD Error Checking Test

https://github.com/agrc/AGRCJavaScriptProjectBoilerPlate/blob/master/src/app/tests/jasmineAMDErrorChecking.js

Update basemap urls

Update basemap URL's from mapserv.utah.gov to basemaps.utah.gov.

Affects:

• BaseMap
• BaseMapSelector

Full extent and back buttons missing icons at 3.11

Basemap selector

The basemap selector doesn't appear to function properly if you have two tiled layers and a dynamic layer on top.

FindAddress:geocodeAddress

This method needs some work.

• Should return a promise (why does it return false always?)
• Should provide a better hook into validation. Right now there's just a private _validate method.
• Overall this module doesn't pass the new linting profile that we have.

Numeric Text Input Validator Module

Create a module that queries for all <input type='number'> elements and sets up validation behavior using standard DOM properties and bootstrap markup conventions.

After the app has initialized markup, the module should use dojo/query to get a NodeList of all related elements.

Then it should set up callbacks for the onchange and onkeyup events. These should use a regular expression that is tuned with the element's min and max DOM properties to validate the value. This should include checking for whole numbers or decimal places. For example for min='0' max='10' "1.5" would be invalid. To allow for "1.5", min='0.0' max='10.0' would be used.

If the value is valid it should set a custom DOM property, isValid, to true and any invalid markup should be hidden/reset.

If the value is not valid it should display an error message and change the color of the input using bootstrap conventions. The custom DOM property, isValid, should also be set to false.

The custom DOM property, isValid, could then be used as validation when the form is submitted.

Initial use case of this module will be the Wildlife app.

@steveoh: What do you think?

magic zoom clobbers all graphics in it's layer

https://github.com/agrc/agrc.widgets/blob/master/widgets/locate/MagicZoom.js#L267

it should be smart enough to only clear it's own graphics.

Print button style

This button does not match.

Magic zoom with newest bootstrap

something just doesn't look right.

Toggle side pane button

This button does not do anything and should hide the side bar.

Fix travis build

does the travis grunt task work locally? It looks very similar to the stubmodule issue I was having? Is the version correct?

• add the badge for travis build status

probably want to do this in a separate branch to be able to experiment and rebase the commits to stay clean.

TRSS in firefox selects improperly

from @sitlaBarry

Find by place name

This is not returning complete results. We probably need a replacement in the new search api.

Find City

This should be wired up to the new search api.

Grunt esri slurp

Throw it in there. Try it as a grunt task with tr latest version from npm.

Order By - MagicZoom

Could use this parameter: https://developers.arcgis.com/en/javascript/jsapi/query-amd.html#orderbyfields