Dynamically updating Pop-up with Time Extent

[cschooley]

I'm not sure exactly where on the Esri community this question should go, but does anyone know if it's possible to create dynamic pop-ups based on time extent?

I am creating a web application with javascript and I know how to create statistics that change based on time extent using timeSlider.watch. I used this to create an information panel with statistics that change based on the time extent. 

For context for the project, I have a feature layer of points with beginning and end times and a layer with county boundaries (no time data). I would like to create a pop-up that says:

"Between {startYear} and {endYear} there were {points that intersect county} in {county} county."

I have gotten this far:

  // county boundary feature layer
  var county = new FeatureLayer({
    portalItem: {
      id: "ba98baef19d447ca83fb2084c396acde"    
    },
    outFields: ["*"],
    minScale: 0,
    maxScale: 0,
    popupTemplate: {
      title: "{Name} County",
      content: queryWellCounts
    }
  });

  ///// Pop up function

  var queryWellsTask = new QueryTask({
    url: "https://services.arcgis.com/ZzrwjTRez6FJiOq4/arcgis/rest/services/OGHistory/FeatureServer/0"
  });

  function queryWellCounts(target) {
    var counts = new StatisticDefinition({
      statisticType: "count",
      onStatisticField: "API",
      outStatisticFieldName: "count_county"
    });
    var query = new Query({
      geometry: target.graphic.geometry,
      outFields: ["*"],
      spatialRelationship: "intersects",
      timeExtent: timeSlider.timeExtent,
      outStatistics: [counts]
    });

    var yearOnly = {year:'numeric'}; //set to show year only in date strings 

    return queryWellsTask.execute(query).then(function(result) {
      var stats = result.features[0].attributes;
      if (stats.count_county==1) {
        return (
        "Between " +
        "<b>" +
        timeSlider.timeExtent.start.toLocaleDateString("en-us",yearOnly) + 
        "</b> and <b>" +
        timeSlider.timeExtent.end.toLocaleDateString("en-us",yearOnly) +
        "</b> there was " +
         "<b>" + 
         stats.count_county +
          "</b>" +
          " well in {NAME} County.") 
      }else{ 
        return(
          "Between " +
          "<b>" +
          timeSlider.timeExtent.start.toLocaleDateString("en-us",yearOnly) + 
          "</b> and <b>" +
          timeSlider.timeExtent.end.toLocaleDateString("en-us",yearOnly) +
          "</b> there were " +
           "<b>" + 
           stats.count_county +
            "</b>" +
            " wells in {NAME} County." )
      }
    });
  }

This works well if the time slider is paused and you click on a county. It shows the correct amount of wells for that county for the current time extent. I would like it to dynamically change as the slider moves (as an info panel I have does), so I'm thinking I need to add timeslider.watch() in the function, but I'm still new to this and am struggling to figure out how that works.

I know how to do it with filtering and featurelayer/featureLayerViews, but not with queries. Can it be done or should I be rethinking how to get the query for the pop-up?

On another note, if I can't get the information within the pop-up to 'watch' the time slider, is there a way for me to 'force close' the pop-ups when someone hits 'play' on the time slider. A bit annoying to the user, but kind of circumvents my issue. 

Any guidance is much appreciated.

Here's the link to the site if you want to look at it.