Latest Contributions by LStroupe

‎01-20-2023

I'm getting this error in the console log as well, but it doesn't seem to be causing an issue in the app or service..... so I'm not sure if I should be worried?

‎04-22-2021

Hi, I'm wondering if ESRI has seen this and could maybe provide a response if possible?

‎11-19-2020

Is there any update on when this issue might be fixed? We are still experiencing the random bar re-arranging when a user selects a different time period filter. I checked and couldn't find the bug (# 000122651) report anywhere on ESRI's website.

‎12-05-2019

Would ESRI please give us an update on this? This is a huge deal for us and it's slowing down business processes immensely. What's the point of drilling down into data, if you cant then export the results or print the map?

‎09-25-2019

Greetings! In my query URL parameters (example below), I have multiple buildings with the same ID (such as an apartment complex), and I would like each building to be highlighted. Currently the query URL function only highlights 1 of the buildings. Is it possible to add the highlight for every building? I'm not sure what in the MapUrlParamsHandler.js file to modify so any help would be greatly appreciated! Thank you! example: https://MY-PORTAL-URL/[MyApp]/?query=Buildings,OCC_ID=%27WINN6670%27

‎06-26-2019

Thank you for the reply! It turns out, our Portal Server had an old version of WAB Deployed with an old JSAPI library setup. Our custom apps were somehow referencing this internal API and causing the issue. This has been fixed and we are no longer having this issue, thanks again!

‎06-25-2019

We are having this issue when using JavaScript API 3.28 & Google Chrome on Android devices only. Any progress on fixing this? Thank you

‎07-10-2018

UPDATE 7/10/2018 In case anyone was curious, I managed to get the video feed working by using the code below. The only issue I noticed is that every time it updates the feed using the setInterval function, the picture flashes as its being updated. A little annoying and not sure how to get around that. Thank you! -Laura <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <link rel="stylesheet" href="https://js.arcgis.com/3.24/dijit/themes/soria/soria.css"> <link rel="stylesheet" href="https://js.arcgis.com/3.24/esri/css/esri.css"> <style> html, body, #mapDiv { height: 100%; width: 100%; margin: 0; padding: 0; } body { background-color: #FFF; overflow: hidden; font-family: "Trebuchet MS"; } </style> <script src="https://js.arcgis.com/3.24/"></script> <script> var atInspContent, videoContent; var map, updateFeature, cameras; require([ "dojo/dom-construct", "esri/map", "esri/dijit/InfoWindow", "esri/layers/FeatureLayer", "esri/InfoTemplate", "esri/tasks/query", "esri/dijit/AttributeInspector", "esri/config", "dojo/number", "dojo/on", "dijit/layout/TabContainer", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/form/Button", "dojo/domReady!" ], function ( domConstruct, Map, InfoWindow, FeatureLayer, InfoTemplate, Query, AttributeInspector, esriConfig, number, on, TabContainer, BorderContainer, ContentPane, Button ) { //infoWindow: Creation var infoWindow = new InfoWindow({}, domConstruct.create("div")); infoWindow.startup(); //Map: Creation var map = new Map("mapDiv", { basemap: "topo", center: [-96.755, 33.176], zoom: 20, infoWindow: infoWindow }); //infoTemplate: Creation var infoTemplate = new InfoTemplate(); infoTemplate.setTitle("${CAMERA_NAME}"); infoTemplate.setContent(setWindowContent()); //Layer: Creation var cameras = new FeatureLayer("MY_CAMERA_URL", { mode: FeatureLayer.MODE_SNAPSHOT, infoTemplate: infoTemplate, outFields: ["*"] }); //Map & infoWindow: Actions //when the camera layer is added to the map, the Attribute Inspector tool (TAB 2) is initialized map.on("layers-add-result", initSelectToolbar); //adds camera layer to map map.addLayers([cameras]); //resizes the infoWindow map.infoWindow.resize(450, 410); //infoWindow Container: Creation function setWindowContent(evt) { //makes a container for tabs var tc = new TabContainer({ style: "height: 100%; width: 100%;" }, dojo.create("div")); //creates tab 1 videoContent = new ContentPane({ title: "Video" }); tc.addChild(videoContent); //creates tab 2 atInspContent = new ContentPane({ title: "Edit" }); tc.addChild(atInspContent); return tc.domNode; }; //infoWindow TAB 1: Gets the camera video feed--------------------------------------------------------// function getVideo(evt) { cameraURL = evt.attributes.URL; setInterval(function () { //assigns the selected camera url to the src attribute of the html iframe document.getElementById('video').src = cameraURL; //sets the cadence for refreshing the image - in this case it's every 1 second }, 1000); return document.getElementById('video'); }; //infoWindow TAB 2: Gets the Attribute Inspector tool--------------------------------------------------// function initSelectToolbar(evt) { var selectQuery = new Query(); map.on("click", function (evt) { selectQuery.geometry = evt.mapPoint; selectQuery.distance = 4; selectQuery.units = "feet" selectQuery.returnGeometry = true; selectQuery.outSpatialReference = map.spatialReference; cameras.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW, function (features) { if (features.length > 0) { updateFeature = features[0]; map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint)); videoContent.setContent(getVideo(features[0])); } else { map.infoWindow.hide(); } }); }); //infoWindow: Action map.infoWindow.on("hide", function () { cameras.clearSelection(); }); //Editable Fields: Configuration var layerInfos = [{ 'featureLayer': cameras, 'showAttachments': false, 'isEditable': true, 'fieldInfos': [{ 'fieldName': 'CAMERA_NAME', 'label': 'Name', 'isEditable': false }, { 'fieldName': 'VideoStream', 'label': 'Video Stream?', 'isEditable': true }, { 'fieldName': 'CorrectView', 'label': 'Correct View?', 'isEditable': true }, { 'fieldName': 'Comments', 'label': 'Comments', 'isEditable': true } ] }]; //Attribute Inspector: Initialize var attInspector = new AttributeInspector({ layerInfos: layerInfos }, domConstruct.create("div")); //Attribute Inspector: Adds save button next to delete button var saveButton = new Button({ label: "Save", "class": "saveButton" }, domConstruct.create("div")); domConstruct.place(saveButton.domNode, attInspector.deleteBtn.domNode, "after"); //Save Button: Action saveButton.on("click", function () { updateFeature.getLayer().applyEdits(null, [updateFeature], null); }); //Attribute Inspector: Adds close button next to save button var closeButton = new Button({ label: "Close", "class": "closeButton" }, domConstruct.create("div")); domConstruct.place(closeButton.domNode, saveButton.domNode, "after"); //Close Button: Action closeButton.on("click", function () { map.infoWindow.hide(); }); //Attribute Inspector: Action attInspector.on("attribute-change", function (evt) { //stores the updates to apply when the save button is clicked updateFeature.attributes[evt.fieldName] = evt.fieldValue; }); //Attribute Inspector: Action attInspector.on("next", function (evt) { updateFeature = evt.feature; }); atInspContent.setContent(attInspector.domNode); }; }); </script> </head> <body class="soria"> <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:true" style="width: 100%; height: 100%; margin: 0;"> <div id="mapDiv" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'censater'"> </div> </div> <iframe id="video" width="400" height="330" frameborder="0" src=""> </iframe> </body> </html>

‎07-06-2018

Unfortunately they are secured feeds and I can't share them. However they are similar in format to this url: https://ourOrg.org/viewer.html?camera=1

‎07-06-2018

Rob, I am unable to view the video stream. The video box appears but the video never loads. This is what I tried using last: function getVideo(evt) { videoWindow = '<video controls="true" height="260" width="330"><source src=' + evt.attributes.HYPERLINK + ' ></source></video>'; return videoWindow; }; I've also tried this below, with no luck either. function getVideo(evt) { url=evt.attributes.HYPERLINK; videoWindow = '<video controls="true" height="260" width="330"><source src=' + url + ' ></source></video>'; return videoWindow; }; Any help would be greatly appreciated. Thank you -Laura

‎07-05-2018

Robert thank you so much! The editor part of the widget is working great! My only issue left is to get the video feed to display in the first tab. Any further insight would be much appreciated. And thank you again! -Laura

‎06-29-2018

Greetings! I am trying to create a custom widget that combines the attribute inspector in one tab, and a live video feed in another tab. I'm currently stuck on populating the contents of each tab. I'm trying to accomplish this via functions, but my results keep showing up as 'undefined' when i run it in the sandbox: ArcGIS API for JavaScript Sandbox Any help would be greatly appreciated!! Thank you -Laura <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <link rel="stylesheet" href="https://js.arcgis.com/3.24/dijit/themes/soria/soria.css"> <link rel="stylesheet" href="https://js.arcgis.com/3.24/dojox/layout/resources/ExpandoPane.css"> <link rel="stylesheet" href="https://js.arcgis.com/3.24/esri/css/esri.css"> <style> html, body, #mapDiv { height: 100%; width: 100%; margin: 0; padding: 0; } body { background-color: #FFF; overflow: hidden; font-family: "Trebuchet MS"; } </style> <script src="https://js.arcgis.com/3.24/"></script> <script> require([ "esri/map", "esri/InfoTemplate", "esri/layers/FeatureLayer", "esri/tasks/query", "esri/dijit/AttributeInspector", "esri/dijit/InfoWindow", "esri/config", "dojo/dom", "dojo/dom-construct", "dojo/number", "dojo/on", "dojo/parser", "dijit/layout/TabContainer", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/form/Button", "dojo/domReady!" ], function ( Map, InfoTemplate, FeatureLayer, Query, AttributeInspector, InfoWindow, esriConfig, dom, domConstruct, number, on, parser, TabContainer, BorderContainer, ContentPane, Button ) { parser.parse(); //create the infoWindow var infoWindow = new InfoWindow({}, domConstruct.create("div")); infoWindow.startup(); //create the map var map = new Map("mapDiv", { basemap: "topo", center: [-96.755, 33.176], zoom: 18, infoWindow: infoWindow }); //set the infoTemplate for the new infoWindow var infoTemplate = new InfoTemplate(); infoTemplate.setTitle("${CAMERA_NAME}"); infoTemplate.setContent(getWindowContent); //define the camera layer that will be added to map var cameras = new FeatureLayer("myURL", { mode: FeatureLayer.MODE_SNAPSHOT, infoTemplate: infoTemplate, outFields: ["*"] }); //add the camera layer to the map map.addLayers([cameras]); //resize the infoWindow map.infoWindow.resize(300, 300); //function that formats and populates the infoWindow content's 2 tabs function getWindowContent(graphic) { //make a container for tabs var tc = new dijit.layout.TabContainer({ style: "height: 100%; width: 100%;" }, dojo.create("div")); //tab 1 var cp1 = new dijit.layout.ContentPane({ title: "Video" }); cp1.setContent(getVideo); tc.addChild(cp1); //tab 2 var cp2 = new dijit.layout.ContentPane({ title: "Edit" }); cp2.setContent(initSelectToolbar); tc.addChild(cp2); return tc.domNode; }; //function that gets the camera url to open and display in tab1 function getVideo(evt) { selectedCamera = evt.feature.attributes.URL; return selectedCamera; }; //function that creates the attribute inspector tab2 function initSelectToolbar(evt) { var selectQuery = new Query(); map.on("click", function (evt) { selectQuery.geometry = evt.mapPoint; selectQuery.distance = 4; selectQuery.units = "feet" selectQuery.returnGeometry = true; cameras.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW, function (features) { if (features.length > 0) { //store the current feature updateFeature = features[0]; map.infoWindow.setTitle(features[0].getLayer().name); map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint)); } else { map.infoWindow.hide(); } }); }); map.infoWindow.on("hide", function () { cameras.clearSelection(); }); var layerInfos = [ { 'featureLayer': cameras, 'showAttachments': false, 'isEditable': true, 'fieldInfos': [ { 'fieldName': 'CAMERA_NAME', 'label': 'Name', 'isEditable': false }, { 'fieldName': 'VideoStream', 'label': 'Video Stream?', 'isEditable': true }, { 'fieldName': 'CorrectView', 'label': 'Correct View?', 'isEditable': true }, { 'fieldName': 'Comments', 'label': 'Comments', 'isEditable': true } ] } ]; //Initialize Attribute Inspector var attInspector = new AttributeInspector({ layerInfos: layerInfos }, domConstruct.create("div")); //add a save button next to the delete button var saveButton = new Button({ label: "Save", "class": "saveButton" }, domConstruct.create("div")); domConstruct.place(saveButton.domNode, attInspector.deleteBtn.domNode, "after"); saveButton.on("click", function () { updateFeature.getLayer().applyEdits(null, [updateFeature], null); }); //adds a close button next to the save button var closeButton = new Button({ label: "Close", "class": "closeButton" }, domConstruct.create("div")); domConstruct.place(closeButton.domNode, saveButton.domNode, "after"); //by clicking the close button the following action will happen closeButton.on("click", function () { map.infoWindow.hide(); }); attInspector.on("attribute-change", function (evt) { //store the updates to apply when the save button is clicked updateFeature.attributes[evt.fieldName] = evt.fieldValue; }); attInspector.on("next", function (evt) { updateFeature = evt.feature; console.log("Next " + updateFeature.attributes.OBJECTID); }); attInspector.on("delete", function (evt) { evt.feature.getLayer().applyEdits(null, null, [evt.feature]); map.infoWindow.hide(); }); map.infoWindow.setContent(attInspector.domNode); } }); </script> </head> <body class="soria"> <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:true" style="width: 100%; height: 100%; margin: 0;"> <div id="mapDiv" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'"></div> </div> </body> </html>

Online Status	Offline
Date Last Visited	2 weeks ago

My Ideas

Latest Contributions by LStroupe

Re: Error while parsing FeatureSet PBF payload in AGOL Dashboard

Re: Dashboard - Parse dates minimum period in weeks

Re: Stacked bar chart changes order of sub groups

Re: Add reporting and ability to export to CSV

ESRI URL Query Parameters - query, highlight, and center on multiple features with same query value?

Re: Touch screen doesn´t respond with Javascript API 3.25

Re: Touch screen doesn´t respond with Javascript API 3.25

Re: Custom widget: combine attribute inspector & live video feed into one widget

Re: Custom widget: combine attribute inspector & live video feed into one widget

Re: Custom widget: combine attribute inspector & live video feed into one widget

Re: Custom widget: combine attribute inspector & live video feed into one widget

Custom widget: combine attribute inspector & live video feed into one widget

Re: Stacked bar chart changes order of sub groups

Re: Add reporting and ability to export to CSV

Re: Touch screen doesn´t respond with Javascript A...

Web AppBuilder Custom Widgets

Imagery and Remote Sensing User Group