4.3 updates

Author: kellyhutchins

config/templateConfig.js

@@ -47,8 +47,8 @@ define({
   //if you want users to be able to specify lat/lon coordinates that define the map's center or
   //specify an alternate basemap via a url parameter.
   "urlItems": [
-    "color","extent", "center", "level", "marker", "feature", "find" // example param. ?theme=<my theme>
+    "color", "extent", "center", "level", "marker", "feature", "find", "sharedTheme", "sharedThemeItem"
   ],
   // For esri hosted environments only. Will automatically create a sharingurl and proxyurl for the application.
   esriEnvironment: false
-});
+});

css/styles.css

@@ -146,14 +146,16 @@ g#mapDiv_graphics_layer path {
   position: absolute;
   right: 0;
   left: 0;
-  top: 10px;
+  top: 0;
   border-top: none;
   border-right: none;
   border-left: none; }
-
+  .esriEditor .dojoxGridScrollbox{
+    top:20px;
+  }
 @media only screen and (min-width: 720px) {
   .esriEditor .esriDrawingToolbar {
-    top: 10px;
+    top: 0;
     right: 0;
     left: 0; } }
 
@@ -588,6 +590,22 @@ img {
   text-decoration: none;
   color: #000;
 }
+.titlePane{
+  height:20px;
+  line-height: 16px;
+}
+.esriPopup.light .titlePane, .esriPopup.dark .titlePane{
+  font-size: 12px;
+  line-height: 16px;
+  height: 30px;
+  padding: 10px;
+  border: 0;
+  border-radius: 3px 3px 0 0;
+  -webkit-border-radius: 3px 3px 0 0;
+}
+.esriPopup.light .titlePane .title, .esriPopup.dark .titlePane .title{
+  line-height: 16px;
+}
 .popupTitle{
   width:100%;
   padding:10px;
@@ -606,6 +624,7 @@ img {
   cursor:pointer;
   background-color: transparent;
   border:none;
+  overflow:visible;
 }
 .popupButton:hover{
   /*match out of the box hover color for home and locate*/
@@ -985,7 +1004,7 @@ h1, h2{
 /*Added hover to match the out-of-the-box hover for the home and locate buttons*/
 .no-touch .panelTool:hover {
   background-color: transparent;
-  background-color: rgba(102, 102, 102, 0.9);
+  background-color: rgba(102, 102, 102, 0.4);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#E6666666,endColorstr=#E6666666);
   zoom: 1; }
 

index.html

@@ -6,14 +6,14 @@
     <meta charset="utf-8">
     <meta name="fragment" content="!">
     <!-- Responsive -->
-    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
+    <meta name="viewport" content="width=device-width", initial-scale=1>
     <meta name="mobile-web-app-capable" content="yes">
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="apple-mobile-web-app-status-bar-style" content="default">
     <!-- End Responsive -->
-    <link rel="stylesheet" href="//js.arcgis.com/3.17/esri/themes/calcite/dijit/calcite.css">
+    <link rel="stylesheet" href="//js.arcgis.com/3.18/esri/themes/calcite/dijit/calcite.css">
 
-    <link rel="stylesheet"  href="//js.arcgis.com/3.17/esri/css/esri.css">
+    <link rel="stylesheet"  href="//js.arcgis.com/3.18/esri/css/esri.css">
     <!-- Load any application specific styles -->
     <link rel="stylesheet" href="css/styles.css">
   </head>
@@ -34,7 +34,7 @@
         <header class="fc" id="panelText" role="banner">
           <hgroup>
             <h1 id="title"></h1>
-            <h2 id="subtitle"</h2>
+            <h2 id="subtitle"></h2>
           </hgroup>
         </header>
         <div role="search" id="panelSearch">
@@ -66,14 +66,14 @@ <h2 id="subtitle"</h2>
       </div>
       </div>
       <!--Modal Splash Screen-->
-      <div id="modal" class="hide dialog-modal" role="dialog" tabindex="-1">
+      <div id="modal" class="hide dialog-modal" aria-labelledby="modalTitle" aria-describedby="modalContent" role="dialog" tabindex="-1">
         <div class="modal-content">
           <header class="modal-header bg fc" >
-            <h2 id="modalTitle" class="dialog-modal" tabindex="0"></h2>
+            <h2 id="modalTitle" class="dialog-modal"></h2>
           </header>
           <div class="copy">
-            <div id="modalContent" class="dialog-modal" tabindex="0" ></div>
-            <input id="closeOverlay" class="dialog-modal bg fc" type="button" tabindex="0"/>
+            <div id="modalContent" class="dialog-modal"></div>
+            <input id="closeOverlay" class="dialog-modal bg fc" type="button"/>
           </div>
         </div>
       </div>
@@ -107,7 +107,7 @@ <h2 id="modalTitle" class="dialog-modal" tabindex="0"></h2>
             return (false);
         }
     </script>
-    <script type="text/javascript" src="//js.arcgis.com/3.17/"></script>
+    <script type="text/javascript" src="//js.arcgis.com/3.18/"></script>
         <script type="text/javascript">
         require([
             "config/templateConfig",

js/SearchSources.js

@@ -159,7 +159,7 @@ define(["dojo/_base/declare", "dojo/_base/lang", "dojo/_base/array", "dojo/_base
             });
           }
           // Set default search fields if not specified
-          if (source.searchFields.length === 0) {
+          if (source.searchFields && source.searchFields.length === 0) {
             if (featureLayer && featureLayer.displayField) {
               source.searchFields = [featureLayer.displayField];
             }

js/main.js

@@ -116,6 +116,12 @@ define([
       // and application id and any url parameters and any application specific configuration information.
       if (config) {
         this.config = config;
+        if (this.config.sharedThemeConfig && this.config.sharedThemeConfig.attributes && this.config.sharedThemeConfig.attributes.theme) {
+          var sharedTheme = this.config.sharedThemeConfig.attributes;
+          this.config.logo = sharedTheme.layout.header.component.settings.logoUrl || sharedTheme.theme.logo.small || null;
+          this.config.color = sharedTheme.theme.text.color;
+          this.config.theme = sharedTheme.theme.body.bg;
+        }
         this.color = this._setColor(this.config.color);
         this.theme = this._setColor(this.config.theme);
         this.iconColor = this._setColor(this.config.iconColor);
@@ -288,7 +294,6 @@ define([
           }
 
           // if no tools are active let's setup support for setting
-          //this._setActiveTool(toolbar);
           on(toolbar, "updateTool", lang.hitch(this,
             function(name) {
               if (name === "measure") {
@@ -318,7 +323,6 @@ define([
                   }));
               }
             }));
-
           domStyle.set("panelPages", "visibility",
             "visible");
           //Now that all the tools have been added to the toolbar we can add page naviagation
@@ -346,7 +350,6 @@ define([
     _showSplashScreen: function(toolbar) {
       // Setup the modal overlay if enabled
       if (this.config.splashModal) {
-
         domClass.add(document.body, "noscroll");
         domClass.remove("modal", "hide");
         domAttr.set("modal", "aria-label", this.config.splashTitle || "Splash Screen");
@@ -393,7 +396,6 @@ define([
       } else {
         deferred.resolve(false);
       }
-
       return deferred.promise;
     },
 
@@ -459,7 +461,6 @@ define([
 
     },
     _addEditor: function(tool, toolbar, panelClass) {
-
       //Add the editor widget to the toolbar if the web map contains editable layers
       var deferred = new Deferred();
       this.editableLayers = this._getEditableLayers(this.config.response
@@ -475,7 +476,6 @@ define([
       } else {
         deferred.resolve(false);
       }
-
       return deferred.promise;
     },
     _createEditor: function() {
@@ -488,7 +488,6 @@ define([
           deferred.resolve(false);
           return;
         }
-
         //add field infos if necessary. Field infos will contain hints if defined in the popup and hide fields where visible is set
         //to false. The popup logic takes care of this for the info window but not the edit window.
         array.forEach(this.editableLayers, lang.hitch(this,
@@ -502,7 +501,6 @@ define([
               var fieldInfos = [];
               array.forEach(fields, lang.hitch(this,
                 function(field) {
-
                   //added support for editing date and time
                   if (field.format && field.format.dateFormat &&
                     array.indexOf(this.timeFormats,
@@ -511,10 +509,10 @@ define([
                       time: true
                     };
                   }
-                  //Add all editable fields even if not visible.
-                  //if (field.visible) {
-                  fieldInfos.push(field);
-                //}
+                  //Only add visible fields
+                  if (field.visible) {
+                    fieldInfos.push(field);
+                  }
                 }));
 
               layer.fieldInfos = fieldInfos;
@@ -526,29 +524,32 @@ define([
           toolbarVisible: has("edit-toolbar")
         };
         this.map.enableSnapping();
+        //show the editor panel so layers render in the widget correctly.
+        domClass.remove(dom.byId("page_edit"), "hide");
         this.editor = new Editor({
           settings: settings
         }, domConstruct.create("div", {}, this.editorDiv));
-
-
+        this.editor.on("load", lang.hitch(this, function() {
+          // hide the panel
+          domClass.add(dom.byId("page_edit"), "hide");
+          deferred.resolve(true);
+        }), function(error) {
+          domClass.add(dom.byId("page_edit"), "hide");
+          deferred.resolve(true);
+        });
         this.editor.startup();
-        deferred.resolve(true);
-
       }));
       return deferred.promise;
-
     },
     _destroyEditor: function() {
       if (this.editor) {
         this.editor.destroy();
         this.editor = null;
       }
-
     },
     _addLayers: function(tool, toolbar, panelClass) {
       //Toggle layer visibility if web map has operational layers
       var deferred = new Deferred();
-
       var layers = this.config.response.itemInfo.itemData.operationalLayers;
 
       if (layers.length === 0) {
@@ -616,7 +617,6 @@ define([
       }
       return deferred.promise;
     },
-
     _addMeasure: function(tool, toolbar, panelClass) {
       //Add the measure widget to the toolbar.
       var deferred = new Deferred();
@@ -675,6 +675,7 @@ define([
               height: "auto"
             }, domConstruct.create("div", {}, ovMapDiv));
             ovMap.startup();
+
             query(".ovwHighlight").forEach(function(node) {
               domAttr.set(node, "tabindex", "0");
               domAttr.set(node, "aria-label", this.config.i18n.map.overviewDetails);
@@ -984,12 +985,10 @@ define([
             createdOptions.activeSourceIndex = this.config.searchConfig
               .activeSourceIndex;
           }
-          console.log(this.config)
           createdOptions.enableSearchingAll = false;
-          if(this.config.searchConfig && this.config.searchConfig.enableSearchingAll && this.config.searchConfig.enableSearchingAll ==  true){
+          if (this.config.searchConfig && this.config.searchConfig.enableSearchingAll && this.config.searchConfig.enableSearchingAll === true) {
             createdOptions.enableSearchingAll = true;
           }
-      console.log(createdOptions.enableSearchingAll)
         }
         var search = new Search(createdOptions, domConstruct.create(
           "div", {
@@ -1176,7 +1175,7 @@ define([
       //Set the font color using the configured color value
       query(".fc").style("color", this.color.toString());
       query(".esriPopup .titlePane").style("color", this.color.toString());
-      query(".esriPopup. .titleButton").style("color", this.color.toString());
+      query(".esriPopup .titleButton").style("color", this.color.toString());
 
     },
     _adjustPopupSize: function() {
@@ -1221,6 +1220,7 @@ define([
       }).then(lang.hitch(this, function(response) {
 
         this.map = response.map;
+        domClass.add(this.map.infoWindow.domNode, "light");
 
         if (params.markerGraphic) {
           // Add a marker graphic with an optional info window if

js/nls/ShareDialog.js

@@ -15,33 +15,35 @@ define({
             }
         }
     }),
-    "ar": 1,
-    "cs": 1,
-    "da": 1,
-    "de": 1,
-    "el": 1,
-    "es": 1,
-    "et": 1,
-    "fi": 1,
-    "fr": 1,
-    "he": 1,
-    "it": 1,
-    "ja": 1,
-    "ko": 1,
-    "lt": 1,
-    "lv": 1,
-    "nl": 1,
-    "nb": 1,
-    "pl": 1,
-    "pt-br": 1,
-    "pt-pt": 1,
-    "ro": 1,
-    "ru": 1,
-    "sv": 1,
-    "tr": 1,
-    "th": 1,
-    "vi": 1,
-    "zh-cn": 1,
-    "zh-hk": 1,
-    "zh-tw": 1
+  "ar": 1,
+  "cs": 1,
+  "da": 1,
+  "de": 1,
+  "el": 1,
+  "es": 1,
+  "et": 1,
+  "fi": 1,
+  "fr": 1,
+  "he": 1,
+  "hr": 1, 
+  "it": 1,
+  "ja": 1,
+  "ko": 1,
+  "lt": 1,
+  "lv": 1,
+  "nl": 1,
+  "nb": 1,
+  "pl": 1,
+  "pt-br": 1,
+  "pt-pt": 1,
+  "ro": 1,
+  "ru": 1,
+  "sr": 1,
+  "sv": 1,
+  "th": 1,
+  "tr": 1,
+  "vi": 1,
+  "zh-cn": 1,
+  "zh-hk": 1, 
+  "zh-tw": 1 
 });