var map;

​

    require([

      "esri/InfoTemplate",

      "esri/map",

      "esri/graphic",

      "esri/layers/FeatureLayer",

      "esri/symbols/SimpleFillSymbol",

      "esri/symbols/SimpleLineSymbol",

      "esri/tasks/query",

      "esri/toolbars/draw",

      "dojo/dom",

      "dojo/on",

      "dojo/_base/array",

      "esri/Color",

      "dojo/domReady!"

    ],

      function (

        InfoTemplate, Map, Graphic, FeatureLayer, SimpleFillSymbol, SimpleLineSymbol,

        Query, Draw, dom, on, arrayUtil, Color

      ) {

​

        var selectionToolbar, featureLayer;

      var ls = localStorage;

      var key = location.href + '--id-selection';

      var parseToGraphics = function (str) {

        if (!str) { return undefined; }

        return JSON.parse(str).map(function(x) {

          return new Graphic(x);

        });

      };

​

        map = new Map("map", {

          basemap: "streets",

          center: [-97.395, 37.537],

          zoom: 11

        });

​

        map.on("load", initSelectToolbar);

​

        var fieldsSelectionSymbol =

          new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,

            new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT,

          new Color([255, 0, 0]), 2), new Color([255, 255, 0, 0.5]));

​

        var content = "<b>Status</b>: ${STATUS}" +

                      "<br><b>Cumulative Gas</b>: ${CUMM_GAS} MCF" +

                      "<br><b>Total Acres</b>: ${APPROXACRE}" +

                      "<br><b>Avg. Field Depth</b>: ${AVG_DEPTH} meters";

        var infoTemplate = new InfoTemplate("${FIELD_NAME}", content);

​

        featureLayer = new FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Petroleum/KSPetro/MapServer/1",

          {

            mode: FeatureLayer.MODE_ONDEMAND,

            infoTemplate: infoTemplate,

            outFields: ["*"]

          });

      featureLayer.on('load', function() {

        var items = parseToGraphics(ls.getItem(key));

        if (items) {

          var q = new Query();

          q.objectIds = items.map(function(x) {

            return x.attributes.OBJECTID;

          });

          featureLayer

            .selectFeatures(q, FeatureLayer.SELECTION_NEW)

            .then(function() {

              items.map(function(x) {

                x.setInfoTemplate(infoTemplate);

              });

              map.infoWindow.setFeatures(items);

              map.infoWindow.show(items[0].geometry.getCentroid());

          });

        }

      });

​

        featureLayer.setDefinitionExpression("PROD_GAS='Yes'");

        featureLayer.setSelectionSymbol(fieldsSelectionSymbol);

        featureLayer.on("selection-complete", sumGasProduction);

        featureLayer.on("selection-clear", function () {

          dom.byId('messages').innerHTML = "<i>No Selected Fields</i>";

        });

        map.addLayer(featureLayer);

​

        on(dom.byId("selectFieldsButton"), "click", function () {

          selectionToolbar.activate(Draw.EXTENT);

        });

​

        on(dom.byId("clearSelectionButton"), "click", function () {

          featureLayer.clearSelection();

          ls.removeItem(key);

        });

​

        function initSelectToolbar (event) {

          selectionToolbar = new Draw(event.map);

          var selectQuery = new Query();

​

          on(selectionToolbar, "DrawEnd", function (geometry) {

            selectionToolbar.deactivate();

            selectQuery.geometry = geometry;

            featureLayer

              .selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW)

              .then(function(results) {

                var data = results.map(function(x) { return x.toJson(); });

                ls.removeItem(key);

                ls.setItem(key, JSON.stringify(data));

            });

          });

        }

​

        function sumGasProduction (fSet) {

          var productionSum = 0;

          //summarize the cumulative gas production to display

          arrayUtil.forEach(fSet.features, function (feature) {

            productionSum += feature.attributes.CUMM_GAS;

          });

          dom.byId('messages').innerHTML = "<b>Selected Fields Production: " +

                                            productionSum + " mcf. </b>";

        }

      });