I know that when viewing my app in Firefox browser, the query widget loads before the layer, which causes the layer to be undefined. To deal with this I set a timeout in my function (_getSelectedLayerInformation) within a Promise, which works and returns the correct info. The problem is that in the function is called I am not getting back anything.
_getSelectedLayerInfomation: function(){
var map = this.map;
var type = 0;//0 means doesn't select any layer
var layerItem = "FRRP_Subregions";
var glayerIds = map.graphicsLayerIds;
var items = this.layerChooserFromMapWithDropbox.getSelectedItems();
if(items.length > 0){
console.log("layer items length ", items.length);
layerItem = "FRRP_Subregions";
}
return new Promise (function(resolve, reject) {
setTimeout(function() {
var layer = map.getLayer("FRRP_Subregions");
console.log("sub-regions ", layer);
if(layer){
console.log("layer ", layer);
//var layerInfo = layerItem.layerInfo;
//layer = layerInfo.layerObject;
if(layer.url){
console.log("layer url ", layer.url);
if(glayerIds.indexOf(layer.id) >= 0){
//layer exist in map
type = 1;
}else{
//layer exist in MapService
type = 2;
}
}else{
//feature collection
type = 3;
}
}
console.log(type, layerItem, layer);
return {
type: type,
layerItem: layerItem,
layer: layer
};
}, 500);
})
},
The above function gets called inside of this function, but returns nothing. I can't figure out how to set up a promise that actually works that will execute the _getSelectedLayerInformation function and then execute the rest of the code.
_featureSetChooser: function() {
this.featureSetChooserForSingleLayer = null;
let info = this._getSelectedLayerInfomation();
info.then(console.log("layer info ", info)); //// returns Promise pending???
if(type > 0){
this.featureSetChooserForSingleLayer = new FeatureSetChooserForSingleLayer({
map: this.map,
featureLayer: info.layer,
updateSelection: false
});
this._selectionHandle = on(info.layer, 'selection-complete', lang.hitch(this, function() {
var oldUseSelectedChecked = this.selectionRadio.getStatus() && this.selectionRadio.getValue();
this._updateSelectedFeaturesCount();
if(oldUseSelectedChecked){
this._updateBuffer();
}
}));
this.own(on(this.featureSetChooserForSingleLayer, 'user-clear', lang.hitch(this, this._onUserClear)));
this.own(on(this.featureSetChooserForSingleLayer, 'loading', lang.hitch(this, lang.hitch(this, function(){
this._clearBufferLayer();
this._onLoading();
}))));
this.own(on(this.featureSetChooserForSingleLayer, 'unloading', lang.hitch(this, lang.hitch(this, function(){
this._onUnloading();
this._updateBuffer();
}))));
this.featureSetChooserForSingleLayer.placeAt(this.featureSetChooserDiv);
//uncheck "Use selected features" option when begin drawing
this.own(on(this.featureSetChooserForSingleLayer, 'draw-activate', lang.hitch(this, function(){
this.uncheckSelectedFeaturesRadio();
})));
}
var draw = query(".jimu-single-layer-featureset-chooser", this.domNode)[0];
console.log("drawbox ", draw);
},
In the above function, the log statement on line 4 returns a pending promise. I am still trying how to implement promises, so I think I am leaving something out, but just can't figure out what that is! Thanks ahead of time for any pointers!