- 
- 
- 
+ - +
- +
- -
| ${nls.fontName} |
-
+
Sans Serif (1)
Sans Serif (2)
Serif (1)
@@ -119,9 +59,9 @@
${nls.editDrawTitle}Fixed Width (2)
-
${nls.boldCharacter}
- ${nls.italicCharacter}
- ${nls.underlineCharacter}
+ ${nls.boldCharacter}
+ ${nls.italicCharacter}
+ ${nls.underlineCharacter}
|
- - ${nls.drawSampleRotatedText} + + ${nls.drawSampleRotatedText} |
+
${nls.addMessage}.
-
-
-
+
diff --git a/Widget.js b/Widget.js
index e3c8f2e..7e308de 100644
--- a/Widget.js
+++ b/Widget.js
@@ -15,608 +15,621 @@
///////////////////////////////////////////////////////////////////////////
define([
- 'dojo/_base/declare',
- 'dijit/_WidgetsInTemplateMixin',
- 'jimu/BaseWidget',
- 'esri/graphic',
- 'esri/geometry/Point',
- 'esri/symbols/SimpleMarkerSymbol',
- 'esri/geometry/Polyline',
- 'esri/symbols/SimpleLineSymbol',
- 'esri/geometry/Polygon',
- "esri/graphicsUtils",
- 'esri/symbols/SimpleFillSymbol',
- 'esri/symbols/TextSymbol',
- 'esri/symbols/Font',
- 'esri/units',
- "esri/toolbars/edit",
- 'esri/geometry/webMercatorUtils',
- 'esri/geometry/geodesicUtils',
- 'dojo/_base/lang',
- 'dojo/on',
- 'dojo/_base/html',
- "dojo/sniff",
- 'dojo/_base/Color',
- 'dojo/_base/query',
- 'dojo/_base/array',
- 'dojo/dom-construct',
- 'dojo/dom',
- 'dijit/form/Select',
- 'dijit/form/NumberSpinner',
- 'jimu/dijit/ViewStack',
- 'jimu/dijit/SymbolChooser',
- 'jimu/dijit/DrawBox',
- 'jimu/dijit/Message',
- 'jimu/utils',
- 'jimu/symbolUtils',
- 'libs/storejs/store',
- 'esri/InfoTemplate',
- 'esri/layers/GraphicsLayer'
- ],
- function(declare,_WidgetsInTemplateMixin,BaseWidget,Graphic,Point,
- SimpleMarkerSymbol,Polyline,SimpleLineSymbol,Polygon,graphicsUtils,SimpleFillSymbol,
- TextSymbol,Font, esriUnits, Edit, webMercatorUtils,geodesicUtils,lang,on,html,has,
- Color,Query,array, domConstruct, dom, Select,NumberSpinner,ViewStack,SymbolChooser,
- DrawBox, Message, jimuUtils, jimuSymbolUtils, localStore, InfoTemplate,GraphicsLayer) {/*jshint unused: false*/
- return declare([BaseWidget, _WidgetsInTemplateMixin], {
- name: 'eDraw',
- baseClass: 'jimu-widget-draw',
-
-
- _drawPlus:{
- "add":{
- "police":false,
- "bold":false,
- "italic":false,
- "underline":false,
- "angle":false
- },
- "edit":{
- "police":false,
- "bold":false,
- "italic":false,
- "underline":false,
- "angle":false
- }
- },
-
- startup: function() {
- this.inherited(arguments);
- this.viewStack.startup();
- this.viewStack.switchView(null);
- },
-
- postMixInProperties: function(){
- this.inherited(arguments);
- this._resetUnitsArrays();
- },
-
- postCreate: function() {
- this.inherited(arguments);
- jimuUtils.combineRadioCheckBoxWithLabel(this.showMeasure, this.showMeasureLabel);
- this.drawBox.setMap(this.map);
-
- this.viewStack = new ViewStack({
- viewType: 'dom',
- views: [this.pointSection, this.lineSection, this.polygonSection, this.textSection]
- });
- html.place(this.viewStack.domNode, this.settingContent);
-
- //Global view (add/list)
- this._initTabs();
-
-
- this._initUnitSelect();
- this._bindEvents();
-
- //load if drawings in localStorage
- this._initLocalStorage();
+ 'dojo/_base/declare',
+ 'dijit/_WidgetsInTemplateMixin',
+ 'jimu/BaseWidget',
+ 'esri/graphic',
+ 'esri/symbols/SimpleMarkerSymbol',
+ 'esri/geometry/Polyline',
+ 'esri/symbols/SimpleLineSymbol',
+ 'esri/geometry/Polygon',
+ "esri/graphicsUtils",
+ 'esri/symbols/SimpleFillSymbol',
+ 'esri/symbols/TextSymbol',
+ 'esri/symbols/Font',
+ 'esri/units',
+ "esri/toolbars/edit",
+ 'esri/geometry/webMercatorUtils',
+ 'esri/geometry/geodesicUtils',
+ 'dojo/_base/lang',
+ 'dojo/on',
+ 'dojo/_base/html',
+ "dojo/sniff",
+ 'dojo/_base/Color',
+ 'dojo/_base/array',
+ 'dojo/dom-construct',
+ 'dojo/dom',
+ 'dijit/form/Select',
+ 'dijit/form/NumberSpinner',
+ 'jimu/dijit/ViewStack',
+ 'jimu/dijit/SymbolChooser',
+ 'jimu/dijit/DrawBox',
+ 'jimu/dijit/Message',
+ 'jimu/utils',
+ 'jimu/symbolUtils',
+ 'libs/storejs/store',
+ 'esri/InfoTemplate',
+ 'esri/layers/GraphicsLayer'
+ ],
+ function (declare, _WidgetsInTemplateMixin, BaseWidget, Graphic, SimpleMarkerSymbol, Polyline, SimpleLineSymbol, Polygon, graphicsUtils, SimpleFillSymbol,
+ TextSymbol, Font, esriUnits, Edit, webMercatorUtils, geodesicUtils, lang, on, html, has,
+ Color, array, domConstruct, dom, Select, NumberSpinner, ViewStack, SymbolChooser,
+ DrawBox, Message, jimuUtils, jimuSymbolUtils, localStore, InfoTemplate, GraphicsLayer) {
+
+ /*jshint unused: false*/
+ return declare([BaseWidget, _WidgetsInTemplateMixin], {
+ name : 'eDraw',
+ baseClass : 'jimu-widget-edraw',
+
- //Popup or click init
- this._initDrawingPopupAndClick();
-
- //Create edit dijit
- this.editToolbar = new Edit(this.map);
- },
-
- resetGeometryEdit:function(){
- if(this._geometryEditSaveGraphic && this._editGraphic){
- var g = new Graphic(this._geometryEditSaveGraphic);
- this._editGraphic.setGeometry(g.geometry);
- }
- },
-
- activateGeometryEdit:function(graphic){
- if(!graphic && this.editToolbar){
- this.editToolbar.deactivate();
- return ;
- }
- // if(graphic.geometry.type=="extent")
- // return;
-
- this._geometryEditSaveGraphic = graphic.toJson();
-
- var tool = 0 | Edit.MOVE;
- if(graphic.geometry.type!="point")
- tool = tool | Edit.EDIT_VERTICES | Edit.SCALE | Edit.ROTATE;
-
- var options = {
- allowAddVertices: true,
- allowDeleteVertices: true,
- uniformScaling: true
- };
- this.editToolbar.activate(tool, graphic, options);
- },
-
- onClose:function(){
- this.selectDrawing(false);
- this._enableMapPreview(false);
- this.activateGeometryEdit(false);
- },
-
- onOpen:function(){
- if(this.drawBox.drawLayer.graphics.length > 0)
- this.setTab("list");
- else
- this.setTab("add");
- },
-
- _initTabs:function(){
- this._tabsConfig={
- "add":{
- button:this.addSectionButton,
- view:this.addSection,
- active:"menu-item-active",
- inactive:"menu-item",
- buttons_when_active:"*"
- },
- "edit":{
- button:this.editSectionButton,
- view:this.editSection,
- onlyVisible:true,
- active:"menu-item-active ",
- inactive:"hidden",
- buttons_when_active:["list"]
- },
- "list":{
- button:this.listSectionButton,
- view:this.listSection,
- onlyVisible:true,
- active:"menu-item-active",
- inactive:"menu-item",
- buttons_when_active:"*"
- },
- "importExport":{
- button:this.importExportSectionButton,
- view:this.importExportSection,
- onlyVisible:true,
- active:"menu-item-active",
- inactive:"menu-item",
- buttons_when_active:"*"
- }
- };
-
- if(!this.config.allowImportExport){
- this.importExportSectionButton.style.display = 'none';
- }
-
- var views = [];
- for(var name in this._tabsConfig)
- views.push(this._tabsConfig[name]["view"]);
-
+//////////////////////////////////////////// GENERAL METHODS //////////////////////////////////////////////////
+ /**
+ * Set widget mode :add1 (type choice), add2 (symbology and attributes choice), edit, list, importExport
+ * @param name string Mode
+ * - add1 : Add drawing (type choice and measure option)
+ * - add2 : Add drawing (attributes and symbol chooser)
+ * - edit : Edit drawing (geometry, attributes and symbol chooser)
+ * - list : List drawings
+ * - importExport :
+ */
+ setMode : function (name) {
+ this.editorEnableMapPreview(false);
+ this.editorActivateGeometryEdit(false);
- this.globalViewStack = new ViewStack({
- viewType: 'dom',
- views: views
- });
- html.place(this.globalViewStack.domNode, this.settingAllContent);
- },
-
+ switch(name){
+ case 'add1':
+ this.setMenuState('add');
+
+ this._editorConfig["graphicCurrent"] = false;
+
+
+ this.TabViewStack.switchView(this.addSection);
+
+ this.drawBox.deactivate();
+
+ this.setInfoWindow(false);
+
+ break;
+ case 'add2':
+ this.setMenuState('add', ['add']);
+
+ this._editorConfig["graphicCurrent"] = false;
+
+ this.editorPrepareForAdd(this._editorConfig["defaultSymbols"][this._editorConfig['commontype']]);
+
+ this.TabViewStack.switchView(this.editorSection);
+
+ this.setInfoWindow(false);
+
+ break;
+ case 'edit':
+ this.setMenuState('edit', ['edit']);
+ if (this._editorConfig["graphicCurrent"]) {
+ //prepare editor
+ this.editorPrepareForEdit(this._editorConfig["graphicCurrent"]);
+
+ //Focus
+ var extent = graphicsUtils.graphicsExtent([this._editorConfig["graphicCurrent"]]);
+ this.map.setExtent(extent.expand(2), true);
+ }
+
+ this.TabViewStack.switchView(this.editorSection);
+
+ this.setInfoWindow(false);
+
+ break;
+ case 'list':
+ this.setMenuState('list');
+
+ //Generate list and
+ this.listGenerateDrawTable();
+ var nb_draws = this.drawBox.drawLayer.graphics.length;
+ var display = (nb_draws > 0) ? 'block' : 'none';
+ html.setStyle(this.allActionsNode, 'display', display);
+ this.tableTH.innerHTML = nb_draws + ' ' + this.nls.draws;
- setTab:function(name){
- var tab_asked = this._tabsConfig[name];
-
- this._enableMapPreview(false);
- this.activateGeometryEdit(false);
-
- if(!tab_asked)
- return false;
-
- for(var tab in this._tabsConfig){
- if(tab==name || tab_asked["buttons_when_active"]=="*" || tab_asked["buttons_when_active"].indexOf(tab) != -1){
- this._tabsConfig[tab]["button"].className =
- (tab==name)
- ? this._tabsConfig[tab]["active"]
- : this._tabsConfig[tab]["inactive"];
- }
- else{
- this._tabsConfig[tab]["button"].className = "hidden";
- }
- }
- this.globalViewStack.switchView(this._tabsConfig[name]["view"]);
-
- switch(name){
- case "add":
- this._editGraphic = false;
- this.selectDrawing(false);
- break;
- case "list":
- this._generateDrawTable();
-
- var nb_draws = this.drawBox.drawLayer.graphics.length;
- var display = (nb_draws>0) ? 'block' : 'none';
- html.setStyle(this.allActionsNode,'display',display);
- this.tableTH.innerHTML = nb_draws + ' ' + this.nls.draws;
-
- //Save data in local storage
- this._saveInLocalStorage();
-
- break;
- case "edit":
- if(this._editGraphic){
- this.selectDrawing(this._editGraphic);
- this.editNameField.value = this._editGraphic.attributes["name"];
- this.editDescriptionField.value = this._editGraphic.attributes["description"];
+ //Save data in local storage
+ this.saveInLocalStorage();
- this.selectDrawing(this._editGraphic);
+ //Other params
+ this._editorConfig["graphicCurrent"] = false;
- this._initEditSymbolChooser();
- this.activateGeometryEdit(this._editGraphic);
- }
-
- break;
- default:
- this._editGraphic = false;
- this.selectDrawing(false);
- }
- return true;
- },
-
- _generateDrawTable:function(){
- //Generate draw features table
- var graphics = this.drawBox.drawLayer.graphics;
- var nb_graphics = graphics.length;
-
- //Table
- this.drawsTableBody.innerHTML = "";
-
- for(var i = nb_graphics-1; i>=0;i--){
- var graphic = graphics[i];
- var num = i+1;
- var symbol = graphic.symbol;
-
- var selected = (this._editGraphic && this._editGraphic==graphic);
-
- if(selected)
- this.selectDrawing(graphic);
-
- if(symbol.type=="textsymbol"){
- var json = symbol.toJson();
- var txt = (json.text.length>4) ? json.text.substr(0,4)+"..." : json.text
- var font = (json.font.size < 14) ? 'font-size:'+json.font.size+'px;' : 'font-size:14px; font-weight:bold;';
- var color = (json.color.lenght==4) ? 'rgba('+json.color.join(",")+')' : 'rgba('+json.color.join(",")+')';
- var symbolHtml = ''+txt+'';
- }else{
- var symbolNode = jimuSymbolUtils.createSymbolNode(symbol, {width:50, height:50});
- var symbolHtml = symbolNode.innerHTML;
- }
- var name = (graphic.attributes && graphic.attributes['name']) ? graphic.attributes['name'] : '';
- var html = '
+
+
+
+
+
+
+