Settings update : add export file name + Better UI.

README.md

@@ -24,7 +24,8 @@ http://doc.arcgis.com/en/web-appbuilder/create-apps/widget-draw.htm
 
 
 ## configuration :
-4 options :
+5 options :
+- export file name.
 - Confirm on delete. A confirm dialog when user delete drawing(s) ?
 - Enable import/export. Let the user import or export drawings ?
 - Enable local storage. enable auto-saving in local storage and loading saved drawings on widget load.

Widget.js

@@ -657,6 +657,7 @@ define([
 			if(!has("ie") && (!navigator.appName || navigator.appName != 'Microsoft Internet Explorer')){
 				this.exportButton.href = 'data:application/json;charset=utf-8,'+this.drawingsAsJson(true);
 				this.exportButton.target = "_BLANK";
+				this.exportButton.download = this.config.exportFileName;
 				return true;
 			}
 
@@ -671,7 +672,7 @@ define([
 			iframe.document.write(this.drawingsAsJson(true));
 			iframe.document.close();
 			iframe.focus();
-			iframe.document.execCommand('SaveAs', true, 'myDraw.json');
+			iframe.document.execCommand('SaveAs', true, this.config.exportFileName);
 
 			return false;
 		}

config.json

@@ -1,4 +1,5 @@
 {
+  "exportFileName":"myDrawings.json",
   "confirmOnDelete":true,
   "allowImportExport":true,
   "allowLocalStorage":true,

setting/Setting.html

@@ -2,32 +2,39 @@
 	<ul class="settings">
 		<li>
 			<span class="input">
-				<input type="checkbox" checked="checked" data-dojo-attach-point="confirmOnDeleteInput" />
+				<input class="jimu-input" type="text" data-dojo-attach-point="exportFileNameInput" value="${nls.exportFileName}" />
+			</span>
+			<span class="label">${nls.exportFileName}</span>
+
+		</li>
+		<li>
+			<span class="input">
+				<input class="jimu-input" type="checkbox" checked="checked" data-dojo-attach-point="confirmOnDeleteInput" />
 			</span>
 			<span class="label">${nls.confirmOnDeleteLabel}</span>
 
 		</li>
 		<li>
 			<span class="input">
-				<input type="checkbox" checked="checked" data-dojo-attach-point="allowImportExportInput" />
+				<input  class="jimu-input" type="checkbox" checked="checked" data-dojo-attach-point="allowImportExportInput" />
 			</span>
 			<span class="label">${nls.allowImportExportLabel}</span>
 
 		</li>
 		<li>
 			<span class="input">
-				<input type="checkbox" checked="checked" data-dojo-attach-point="allowLocalStorageInput" />
+				<input  class="jimu-input" type="checkbox" checked="checked" data-dojo-attach-point="allowLocalStorageInput" />
 			</span>
 			<span class="label">${nls.allowLocalStorageLabel}</span>
 
 		</li>
 		<li>
 			<span class="input">
-				<input type="text" data-dojo-attach-point="localStorageKeyInput" />
+				<input  class="jimu-input" type="text" data-dojo-attach-point="localStorageKeyInput" />
 			</span>
 			<span class="label">
 				${nls.localStorageKeyLabel}
-				<a href="#" title="${nls.localStorageKeyInfo}">?</a>
+				<a data-dojo-attach-event="ondijitclick:localStorageKeyMessage" href="#" title="${nls.localStorageKeyInfo}">?</a>
 			</span>
 
 		</li>

setting/Setting.js

@@ -25,16 +25,22 @@ define([
     'jimu/BaseWidgetSetting',
     'jimu/dijit/TabContainer',
     'jimu/dijit/SimpleTable',
+    'jimu/dijit/Message',
     'jimu/utils',
     'dijit/form/Select'
   ],
   function(declare, lang, array, html, query, on, _WidgetsInTemplateMixin, BaseWidgetSetting,
-    TabContainer, SimpleTable, jimuUtils, Select) {
+    TabContainer, SimpleTable,Message, jimuUtils, Select) {
     return declare([BaseWidgetSetting, _WidgetsInTemplateMixin], {
       baseClass: 'jimu-widget-draw-setting',
       distanceUnits:null,
       areaUnits:null,
-
+
+	  localStorageKeyMessage:function(){
+			new Message({message:this.nls.localStorageKeyInfo});
+
+		},	  
+
       postMixInProperties:function(){
         this.inherited(arguments);
 
@@ -146,6 +152,7 @@ define([
         this._setDistanceTable(this.config.distanceUnits);
         this._setAreaTable(this.config.areaUnits);
 
+		this.exportFileNameInput.value = (config.exportFileName) ? config.exportFileName : this.nls.exportFileName;
 		this.confirmOnDeleteInput.checked = (config.confirmOnDelete) ? true : false;
 		this.allowImportExportInput.checked = (config.allowImportExport) ? true : false;
 		this.allowLocalStorageInput.checked = (config.allowLocalStorage) ? true : false;
@@ -184,6 +191,7 @@ define([
         config.distanceUnits = this._getDistanceConfig();
         config.areaUnits = this._getAreaConfig();
 
+		config.exportFileName = (this.exportFileNameInput.value.trim() != "") ? this.exportFileNameInput.value.trim() : this.nls.exportFileName;
 		config.confirmOnDelete = this.confirmOnDeleteInput.checked;
 		config.allowImportExport = this.allowImportExportInput.checked;
 		config.allowLocalStorage = this.allowLocalStorageInput.checked;

setting/css/style.css

@@ -29,4 +29,23 @@
 .jimu-rtl .jimu-widget-draw-setting .btn-add-section .btn-add-label{
   margin-left: 0;
   margin-right: 7px;
+}
+
+.jimu-widget-draw-setting .settings{
+	list-style-type:none;
+	display:table;
+}
+.jimu-widget-draw-setting .settings li{
+	display:table-row;
+}
+.jimu-widget-draw-setting .settings .input{
+	display:table-cell;
+	width:49%;
+	text-align:right;
+}
+.jimu-widget-draw-setting .settings .label{
+	display:table-cell;
+	width:49%;
+	text-align:left;
+	padding-left:10px;
 }

setting/nls/fr/strings.js

@@ -26,6 +26,7 @@
 	allowImportExportLabel:"Activer l'import et l'export",
 	allowLocalStorageLabel:"Utiliser local storage",
 	localStorageKeyLabel:"Clé Local storage",
-	localStorageKeyInfo:"Si vide, toutes les applications partageront le même storage. Sinon, les applications avec la même clé partageront le même storage."
+	localStorageKeyInfo:"Si vide, toutes les applications partageront le même storage. Sinon, les applications avec la même clé partageront le même storage.",
+	exportFileName:"mesDessins.json",
   })
 );

setting/nls/strings.js

@@ -26,7 +26,8 @@ define({
 	allowImportExportLabel:"Allow import & export ?",
 	allowLocalStorageLabel:"Use local storage ?",
 	localStorageKeyLabel:"Local storage key",
-	localStorageKeyInfo:"If not empty, applications with same key (and same server) will share the same storage. If empty, all will share same storage."
+	localStorageKeyInfo:"If not empty, applications with same key (and same server) will share the same storage. If empty, all will share same storage.",
+	exportFileName:"myDrawings.json"
   }),
   "ar": 1,
   "cs": 1,