AnsweredAssumed Answered

How can I get the image node in popup?

Question asked by cmathers on Aug 23, 2017
Latest reply on Aug 23, 2017 by rscheitlin

I have an info template that is just a single picture from a traffic camera that's inserted using the media type. Nothing fancy here. I want it to update the image every second but I cant seem to get the node for the image. I've used every kind of getElementsBy and querySelector and combination of the two that I can think of but the image eludes me. The best I have gotten is using what I have below which yields me an html collection with one object, the esri-popup-renderer__media-item, that has the image as a child but when I try to search it for the img tag I get nothing. I tried jQuery selection with $(".esri-popup-renderer__media-item img:first") but it returned the entire html document.

 

If there is an easier way to make this image update I'm willing to completely abandon this strategy.

 

 

    view.popup.watch("visible", function (visible) {
        if (visible === true) {
            var media_item = document.getElementsByClassName("esri-popup-renderer__media-item");
            console.log(media_item);
            var image = media_item.getElementsByTagName("img");
            console.log(image.src);
            function updateImage() {
                image.src = image.src.split("?")[0] + "?t=" + new Date().getTime();
            }
            var image_refresh_interval = setInterval(updateImage, 1000);
        }else{
            clearInterval(image_refresh_interval);
        }
    });

Outcomes