Latest Contributions by BenFousek

The sample is working. The dock is there and functioning. The problem is the floating pane is not visible by default and the dock isn't showing for some reason. It might be styling. You can manually show the floating pane by running dijit.byId('floater').show() in the console. Try moving the divs for the dock and floating pane outside the border container div. Also try setting the 'map' to 'z-index:1;' and the 'dock' to 'z-index:50;'. I use a lot of floating panes, but I hide the dock and show floating panes with buttons, etc. ... View more

It's still there and working in 3.7. The sample doesn't seem to work for an unrelated reason. If you are using AMD you need to require dojox/layout/Dock. The legacy floating pane require loaded the dock module. AMD: require([   'dojox/layout/FloatingPane',   'dojox/layout/Dock',   'dojo/dom-construct',   'dojo/_base/window' ], function (FloatingPane, Dock, domConstruct, win) {   var dock = new Dock({     //params   }, domConstruct.create('div', null, win.body()));   var fp = new FloatingPane({     //params     dockTo: dock   }, domConstruct.create('div', null, win.body()));   fp.startup(); }); ... View more

My problem is: How can I move the myEditor.startup(); to the div container of the editor accordion pane, so that the editor only loaded after expanding this pane. The easy solution is to connect to the editor pane's on show event to start the editor. 1. The pane must have an id. [HTML]<div id="editorPane" data-dojo-type="dijit.layout.ContentPane" title="Editor Tool">   <div id="templateDiv"></div>   <div id="editorDiv"></div> </div>[/HTML] 2. Connect to the on show event. //replace this //myEditor.startup(); //with this var editorStartup = dom.byId('editorPane').on('show', function () {   editorStartup.remove(); //remove event else it will be called every time pane is shown   myEditor.startup(); }); ... View more

Hey Jeff, This may or may not be of assistance to you in general; I assume you won't stretch out the seams in putting on the coat. Your post caught I attention, it's Friday, and I feel like sharing; so let me expand on Matt's concept a little bit and talk about loading content and functionality using on demand loading with content panes or any widget which extends dijit/_Container. You can load html, including widgets, and javascript placed in a html file by using the href property of a content pane. By default a content pane only loads the href on first show. So content loaded into a accordion pane via a href, which isn't initially visible, isn't loaded until the user clicks on it. As far as executing javascript on load there are a couple options available with dijit.layout.ContentPane and dojox.layout.ContentPane, which can be found in dojo docs. This is especially handy in an app with a lot of little tasks and tools with varying levels of usage. Some might get used a few times daily or maybe once a week. Below is the html for my "poor developer's widget" for measuring, which is html/measure.html relative to the application. Measure is initiated from a toolbar button. The floating pane and button are created in the init of the application with the floating pane's href property set to the html file. It only loads when the user first shows the floating pane by clicking the button. Because I have one global variable/object app, which I create everything in, it's easy to extend as needed. You'll notice that I call a lot of functions and use objects which already exist as part of the application, e.g. functions for controlling map click events. This is one reason I started getting away from true widgets for this sort of thing; either I was using globals directly or passing them as variables to the widget. It always ended up being more code than doing it this way. It's also a great way to load custom mods and widgets on demand too using the on load abilities of the content pane. [HTML]<div class="dojoxFloatingPaneWrapper"> <div data-dojo-type="dijit/form/Button" data-dojo-props="label: 'Loacation', showLabel: false, title: 'Location', iconClass: 'iconMeasurePnt', onClick: app.measure.location"></div>     <div data-dojo-type="dijit/form/Button" data-dojo-props="label: 'Distance', showLabel: false, title: 'Distance', iconClass: 'iconMeasureDist', onClick: app.measure.distance"></div>     <div data-dojo-type="dijit/form/Button" data-dojo-props="label: 'Area', showLabel: false, title: 'Area', iconClass: 'iconMeasureArea', onClick: app.measure.area"></div>     <div data-dojo-type="dijit/form/Button" data-dojo-props="label: 'Clear', showLabel: false, title: 'Clear', iconClass: 'iconCross', onClick: app.measure.clear"></div>     <div id="measure-results" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="style: 'padding:6px 0 0'"></div> </div> <script> app.measure = {   loaded: false,   load: function () {     app.measure.results = dijit.byId('measure-results');     app.map.addLayer(app.measure.layer = new esri.layers.GraphicsLayer(), 0);     app.measure.loaded = true;   },   location: function () {     if (!app.measure.loaded) {       app.measure.load();     };     app.measure.layer.clear();     app.utility.reset.start();     app.map.setMapCursor('crosshair');     app.map.toaster.setContent('Click on the map to return location.');     app.measure.results.destroyDescendants();     app.measure.results.set('content', 'Click on the map to return location.');     app.map.drawToolbar.activate('point');     var on = app.map.drawToolbar.on('draw-end', function (result) {       on.remove();       app.utility.reset.end();       app.map.drawToolbar.deactivate();       app.measure.layer.add(new esri.Graphic(result.geometry, new esri.symbol.SimpleMarkerSymbol('cross', 20, new esri.symbol.SimpleLineSymbol('solid', new dojo.Color([255, 0, 255]), 2), new dojo.Color([255, 0, 255, 1])), null, null));       var lat = result.geometry.getLatitude();       var lng = result.geometry.getLongitude();       var pp = new esri.tasks.ProjectParameters();       pp.geometries = [result.geometry];       pp.outSR = new esri.SpatialReference({         wkid: 26910       });       esri.config.defaults.geometryService.project(pp, function (results) {         app.measure.results.set('content', '<b>Latitude-Longitude</b><br />' + lat + '<br />' + lng + '<br />' + app.utility.dms.lat(lat) + '<br />' + app.utility.dms.lng(lng) + '<br /><b>UTM Zone 10N</b><br />N: ' + (Math.round(results[0].y * 1000) / 1000) + '<br />E: ' + (Math.round(results[0].x * 1000) / 1000));       }, function (error) {         console.log(error);         app.error('A geometry service projection error has occurred.');         app.measure.clear();       });     });     app.utility.reset.on.push(on);   },   distance: function () {     if (!app.measure.loaded) {       app.measure.load();     };     app.measure.layer.clear();     app.utility.reset.start();     app.map.setMapCursor('crosshair');     app.map.toaster.setContent('Click to add vertex; double-click to end and return distance.');     app.measure.results.destroyDescendants();     app.measure.results.set('content', 'Click to add vertex; double-click to end and return distance.');     app.map.drawToolbar.activate('polyline');     var on = app.map.drawToolbar.on('draw-end', function (result) {       on.remove();       app.utility.reset.end();       app.map.drawToolbar.deactivate();       app.measure.layer.add(new esri.Graphic(result.geometry, new esri.symbol.SimpleLineSymbol('solid', new dojo.Color([255, 0, 255]), 2), null, null));       var length = esri.geometry.geodesicLengths([esri.geometry.webMercatorToGeographic(result.geometry)], esri.Units.FEET);       app.measure.results.set('content', '<b>Length</b><br />' + (Math.round(length[0] * 100) / 100) + ' feet<br />' + (Math.round((length[0] / 5280) * 100) / 100) + ' miles');     });     app.utility.reset.on.push(on);   },   area: function () {     if (!app.measure.loaded) {       app.measure.load();     };     app.measure.layer.clear();     app.utility.reset.start();     app.map.setMapCursor('crosshair');     app.map.toaster.setContent('Click to add vertex; double-click to end and return area.');     app.measure.results.destroyDescendants();     app.measure.results.set('content', 'Click to add vertex; double-click to end and return area.');     app.map.drawToolbar.activate('polygon');     var on = app.map.drawToolbar.on('draw-end', function (result) {       on.remove();       app.utility.reset.end();       app.map.drawToolbar.deactivate();       app.measure.layer.add(new esri.Graphic(result.geometry, new esri.symbol.SimpleLineSymbol('solid', new dojo.Color([255, 0, 255]), 2), null, null));       var area = esri.geometry.geodesicAreas([esri.geometry.webMercatorToGeographic(result.geometry)], esri.Units.SQUARE_FEET);       app.measure.results.set('content', '<b>Area</b><br />' + (Math.round(area[0] * 100) / 100) + ' sq. feet<br />' + (Math.round((area[0] / 43560) * 100) / 100) + ' acres');     });     app.utility.reset.on.push(on);   },   clear: function () {     app.utility.reset.all();     if (app.measure.layer) {       app.measure.layer.clear()     }     if (app.measure.loaded) {       app.measure.results.destroyDescendants();     }   } }; </script>[/HTML] I checked out your app. You might be able to improve load time and performance by loading some of your functionalities on demand. I'm not sure how all this will play out with AMD. I'm preparing for full conversion, which with 6k lines of code just to load the app, it's a bit nerve racking. No reason to keep putting off the inevitable. 🙂 Have a great weekend! Ben ... View more

Try setting a width on the right pane. Because you are using a splitter also set the minSize property. minSize is an integer of pixels. <div data-dojo-type="dijit.layout.ContentPane" id="rightPane" class="roundedCorners" data-dojo-props="region:'right', style: 'width:350px;', minSize: 350, splitter:'true'">    Right section </div> ... View more

This is driving me crazy. As is, the layer is selecting a feature every time a feature is clicked. When inspecting the html of the popup, after the first click the attribute inspector node is there and populated; on subsequent selections the node is still there but its div is empty. For whatever reason the inspector is not getting updated with the new selection. I have thoroughly dissected the inspector object and I can't see any method for manually setting the inspector with a feature or through the feature layer object. If I create a div somewhere else in the app and set it as srcNodeRef it works fine. layer.inspector = new esri.dijit.AttributeInspector({ layerInfos: [  layerInfo ] }, 'temp-attributes' /*dojo.create('div')*/); Any ideas? Derek? Kelly? Anyone? ... View more

Happens to the best of us. Rock on! ... View more

Great. Glad you got it working. ... View more

Hmmm... I've used placeholder forever and in every text widget. Never had a problem. <input id="project-save-name" data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required: true, placeholder: 'Name', style: 'width:300px;'" /> ... View more

This doesn't work? <textarea data-dojo-type="dijit/form/Textarea" data-dojo-props="placeholder: 'Enter an Address, Place or ZIP.'" id="taAddress"/></textarea> I think you are getting the type error because you aren't wrapping in a function, but you don't need it with placeholder. registry.byId("taAddress").on("click", function (evt) { clearTextInput('taAddress') }); ... View more

Use the placeholder parameter. Works for all text widgets. No extra code required. <input data-dojo-type="dijit/form/TextBox" data-dojo-props="placeholder: 'Search place or address'" /> ... View more

If they are points, why not esri.geometry.Multipoint? If not, I would assume there is a way to create multi-part graphics by merging geometries. I've never done that creating custom graphics, but server returns multi-part features, e.g. a parcel of land with a right-of-way through it, as a single geometry/graphic. ... View more