From 3a5c1edbe5f74180bc21424959aa126e3965b1aa Mon Sep 17 00:00:00 2001 From: Tim McGee Date: Tue, 3 Jun 2014 09:31:28 -0700 Subject: [PATCH] Added optional id for creation of TitlePane and Floating Widgets. This allows styling the individual widgets using CSS to add an icon on the TitleBar for example. You can also programmatically control of the widgets (open/close/etc) from code. --- viewer/js/viewer/Controller.js | 24 +++++++++++++----------- viewer/js/viewer/config.js | 9 +++++++++ 2 files changed, 22 insertions(+), 11 deletions(-) diff --git a/viewer/js/viewer/Controller.js b/viewer/js/viewer/Controller.js index e4e7f8eb3..0a994ab1e 100644 --- a/viewer/js/viewer/Controller.js +++ b/viewer/js/viewer/Controller.js @@ -196,16 +196,18 @@ define([ domClass.add(this.sideBarToggle, 'close'); } }, - _createTitlePaneWidget: function(title, position, open) { + _createTitlePaneWidget: function(id, title, position, open) { var tp = new TitlePane({ + id: id, title: title, open: open }).placeAt(this.sidebar, position); tp.startup(); return tp; }, - _createFloatingWidget: function(title) { + _createFloatingWidget: function(id, title) { var fw = new FloatingWidget({ + id: id, title: title }); fw.startup(); @@ -233,7 +235,7 @@ define([ })); }, legend: function(widgetConfig, position) { - var legendTP = this._createTitlePaneWidget(widgetConfig.title, position, widgetConfig.open); + var legendTP = this._createTitlePaneWidget(widgetConfig.id, widgetConfig.title, position, widgetConfig.open); require(['esri/dijit/Legend'], lang.hitch(this, function(Legend) { this.legend = new Legend({ map: this.map, @@ -242,7 +244,7 @@ define([ })); }, TOC: function(widgetConfig, position) { - var TOCTP = this._createTitlePaneWidget(widgetConfig.title, position, widgetConfig.open); + var TOCTP = this._createTitlePaneWidget(widgetConfig.id, widgetConfig.title, position, widgetConfig.open); require(['gis/dijit/TOC'], lang.hitch(this, function(TOC) { this.toc = new TOC({ map: this.map, @@ -252,7 +254,7 @@ define([ })); }, bookmarks: function(widgetConfig, position) { - var bookmarksTP = this._createTitlePaneWidget(widgetConfig.title, position, widgetConfig.open); + var bookmarksTP = this._createTitlePaneWidget(widgetConfig.id, widgetConfig.title, position, widgetConfig.open); require(['gis/dijit/Bookmarks'], lang.hitch(this, function(Bookmarks) { this.bookmarks = new Bookmarks({ map: this.map, @@ -262,7 +264,7 @@ define([ })); }, draw: function(widgetConfig, position) { - var drawTP = this._createTitlePaneWidget(widgetConfig.title, position, widgetConfig.open); + var drawTP = this._createTitlePaneWidget(widgetConfig.id, widgetConfig.title, position, widgetConfig.open); require(['gis/dijit/Draw'], lang.hitch(this, function(Draw) { this.drawWidget = new Draw({ map: this.map, @@ -272,7 +274,7 @@ define([ })); }, measure: function(widgetConfig, position) { - var measureTP = this._createTitlePaneWidget(widgetConfig.title, position, widgetConfig.open); + var measureTP = this._createTitlePaneWidget(widgetConfig.id, widgetConfig.title, position, widgetConfig.open); require(['esri/dijit/Measurement'], lang.hitch(this, function(Measurement) { this.measure = new Measurement({ map: this.map, @@ -288,7 +290,7 @@ define([ })); }, print: function(widgetConfig, position) { - var printTP = this._createTitlePaneWidget(widgetConfig.title, position, widgetConfig.open); + var printTP = this._createTitlePaneWidget(widgetConfig.id, widgetConfig.title, position, widgetConfig.open); require(['gis/dijit/Print'], lang.hitch(this, function(Print) { this.printWidget = new Print({ map: this.map, @@ -303,7 +305,7 @@ define([ })); }, directions: function(widgetConfig, position) { - var directionsTP = this._createTitlePaneWidget(widgetConfig.title, position, widgetConfig.open); + var directionsTP = this._createTitlePaneWidget(widgetConfig.id, widgetConfig.title, position, widgetConfig.open); require(['gis/dijit/Directions'], lang.hitch(this, function(Directions) { this.directionsWidget = new Directions({ map: this.map, @@ -314,7 +316,7 @@ define([ })); }, editor: function(widgetConfig, position) { - var editorTP = this._createTitlePaneWidget(widgetConfig.title, position, widgetConfig.open); + var editorTP = this._createTitlePaneWidget(widgetConfig.id, widgetConfig.title, position, widgetConfig.open); require(['gis/dijit/Editor'], lang.hitch(this, function(Editor) { this.editor = new Editor({ map: this.map, @@ -354,7 +356,7 @@ define([ })); }, streetview: function(widgetConfig, position) { - this.streetviewFW = this._createFloatingWidget(widgetConfig.title, widgetConfig.open); + this.streetviewFW = this._createFloatingWidget(widgetConfig.id, widgetConfig.title, widgetConfig.open); require(['gis/dijit/StreetView'], lang.hitch(this, function(StreetView) { this.streetview = new StreetView({ map: this.map, diff --git a/viewer/js/viewer/config.js b/viewer/js/viewer/config.js index 98885c5a3..ff7d998b9 100644 --- a/viewer/js/viewer/config.js +++ b/viewer/js/viewer/config.js @@ -130,30 +130,35 @@ define([ sidebarWidgets: { legend: { include: true, + id: 'sidebar_Legend', title: 'Legend', open: false, position: 0 }, TOC: { include: true, + id: 'sidebar_TOC', title: 'Layers', open: false, position: 1 }, bookmarks: { include: true, + id: 'sidebar_Bookmarks', title: 'Bookmarks', open: false, position: 2 }, draw: { include: true, + id: 'sidebar_Draw', title: 'Draw', open: false, position: 3 }, measure: { include: true, + id: 'sidebar_Measure', title: 'Measurement', open: false, position: 4, @@ -162,6 +167,7 @@ define([ }, print: { include: true, + id: 'sidebar_Print', title: 'Print', open: false, position: 5, @@ -174,6 +180,7 @@ define([ }, directions: { include: true, + id: 'sidebar_Directions', title: 'Directions', open: false, position: 6, @@ -187,6 +194,7 @@ define([ }, editor: { include: true, + id: 'sidebar_Editor', title: 'Editor', open: false, position: 7, @@ -206,6 +214,7 @@ define([ }, streetview: { include: true, + id: 'floating_StreetView', title: 'Google Street View', openOnStartup: true, options: {}