diff --git a/Widget.html b/Widget.html
index 08638eb..a3d8fba 100644
--- a/Widget.html
+++ b/Widget.html
@@ -74,11 +74,28 @@
${nls.importTitle}
diff --git a/Widget.js b/Widget.js
index 94737d9..5af2c3e 100644
--- a/Widget.js
+++ b/Widget.js
@@ -435,7 +435,11 @@ define([
"bold" : false,
"italic" : false,
"underline" : false,
- "angle" : false
+ "angle" : false,
+ "placement" : {
+ "vertical" : "middle",
+ "horizontal" : "center"
+ }
},
phantom : {
"point" : false,
@@ -500,6 +504,9 @@ define([
var type = symbol.type;
//Draw plus and specific comportment when text symbol.
if (type == "textsymbol") {
+ //Force editorSymbolChooser _init to walk around jimu.js bug (initTextSection doesn't pass symbol to _initTextSettings)
+ this.editorSymbolChooser._initTextSettings(symbol);
+
//show draw plus
this.editorSymbolTextPlusNode.style.display = 'block';
@@ -512,20 +519,25 @@ define([
this._editorConfig["drawPlus"]["bold"] = (symbol.font.weight == esri.symbol.Font.WEIGHT_BOLD);
this._editorConfig["drawPlus"]["italic"] = (symbol.font.style == esri.symbol.Font.STYLE_ITALIC);
this._editorConfig["drawPlus"]["underline"] = (symbol.font.decoration == 'underline');
+ this._editorConfig["drawPlus"]["placement"]["horizontal"] = symbol.horizontalAlignment;
+ this._editorConfig["drawPlus"]["placement"]["vertical"] = symbol.verticalAlignment;
this.editorTextPlusPoliceNode.set("value", symbol.font.family);
this.editorTextPlusAngleNode.set("value", symbol.angle);
this._UTIL__enableClass(this.editorTextPlusBoldNode, 'selected', this._editorConfig["drawPlus"]["bold"]);
this._UTIL__enableClass(this.editorTextPlusItalicNode, 'selected', this._editorConfig["drawPlus"]["italic"]);
this._UTIL__enableClass(this.editorTextPlusUnderlineNode, 'selected', this._editorConfig["drawPlus"]["underline"]);
+ for(var i in this._editorTextPlusPlacements){
+ var title_tab = this._editorTextPlusPlacements[i].title.split(" ");
+ var selected = (title_tab[0] == symbol.verticalAlignment && title_tab[1] == symbol.horizontalAlignment);
+ this._UTIL__enableClass(this._editorTextPlusPlacements[i], 'selected', selected);
+ }
} else {
//Hide draw plus
this.editorSymbolTextPlusNode.style.display = 'none';
}
},
- editorActivateSnapping:function(bool){
- console.log("Snapping : " + bool);
-
+ editorActivateSnapping:function(bool){
//If disable
if(!bool){
this.map.disableSnapping();
@@ -555,18 +567,27 @@ define([
var weight = this._editorConfig["drawPlus"]["bold"] ? esri.symbol.Font.WEIGHT_BOLD : esri.symbol.Font.WEIGHT_NORMAL;
var style = this._editorConfig["drawPlus"]["italic"] ? esri.symbol.Font.STYLE_ITALIC : esri.symbol.Font.STYLE_NORMAL;
var decoration = this._editorConfig["drawPlus"]["underline"] ? 'underline' : 'none';
+ var horizontal = this._editorConfig["drawPlus"]["placement"]["horizontal"];
+ var vertical = this._editorConfig["drawPlus"]["placement"]["vertical"];
+
+ //Prepare symbol
+ var symbol = this.editorSymbolChooser.getSymbol();
+ this.editorSymbolChooser.inputText.value = text;
+ symbol.text = text;
+ symbol.font.setFamily(family);
+ symbol.setAngle(angle);
+ symbol.setHorizontalAlignment(horizontal);
+ symbol.setVerticalAlignment(vertical);
+ symbol.font.setWeight(weight);
+ symbol.font.setStyle(style);
+ symbol.font.setDecoration(decoration);
//Set in symbol chooser
this.editorSymbolChooser.inputText.value = text;
- this.editorSymbolChooser.symbol.text = text;
- this.editorSymbolChooser.symbol.font.setFamily(family);
- this.editorSymbolChooser.symbol.setAngle(angle);
- this.editorSymbolChooser.symbol.font.setWeight(weight);
- this.editorSymbolChooser.symbol.font.setStyle(style);
- this.editorSymbolChooser.symbol.font.setDecoration(decoration);
+ this.editorSymbolChooser.showBySymbol(symbol);
//Update in drawBox
- this.drawBox.setTextSymbol(this.editorSymbolChooser.symbol);
+ this.drawBox.setTextSymbol(symbol);
//Update preview
this.editorSymbolChooser.textPreview.innerHTML = text;
@@ -574,18 +595,18 @@ define([
this.editorSymbolChooser.textPreview.style['font-style'] = (this._editorConfig["drawPlus"]["italic"]) ? 'italic' : 'normal';
this.editorSymbolChooser.textPreview.style['font-weight'] = (this._editorConfig["drawPlus"]["bold"]) ? 'bold' : 'normal';
this.editorSymbolChooser.textPreview.style['text-decoration'] = (this._editorConfig["drawPlus"]["underline"]) ? 'underline' : 'none';
- this.editorSymbolChooser.textPreview.style.transform = 'rotate(' + angle + 'deg)';
- this.editorSymbolChooser.textPreview.style['-ms-transform'] = 'rotate(' + angle + 'deg)';
//Update angle preview
- this.editorTextAnglePreviewNode.style['font-style'] = (this._editorConfig["drawPlus"]["italic"]) ? 'italic' : 'normal';
- this.editorTextAnglePreviewNode.style['font-weight'] = (this._editorConfig["drawPlus"]["bold"]) ? 'bold' : 'normal';
- this.editorTextAnglePreviewNode.style['text-decoration'] = (this._editorConfig["drawPlus"]["underline"]) ? 'underline' : 'none';
this.editorTextAnglePreviewNode.style.transform = 'rotate(' + angle + 'deg)';
this.editorTextAnglePreviewNode.style['-ms-transform'] = 'rotate(' + angle + 'deg)';
- //Update phantom symbol
- this.editorUpdateMapPreview(this.editorSymbolChooser.symbol);
+ //Update symbol on map if on modification
+ if(this._editorConfig["graphicCurrent"])
+ this._editorConfig["graphicCurrent"].setSymbol(symbol);
+ else{
+ //Update phantom symbol
+ this.editorUpdateMapPreview(symbol);
+ }
},
editorSetDefaultSymbols : function () {
@@ -762,7 +783,7 @@ define([
this._editorConfig["graphicCurrent"].attributes["name"] = this.nameField.value;
this._editorConfig["graphicCurrent"].attributes["description"] = this.descriptionField.value;
- this._editorConfig["graphicCurrent"].setSymbol(this.editorSymbolChooser.symbol);
+
this.setMode("list");
},
editorOnClickEditCancelButon : function () {
@@ -1084,17 +1105,20 @@ define([
//Bind symbol chooser change
this.own(on(this.editorSymbolChooser, 'change', lang.hitch(this, function () {
this.editorSetDefaultSymbols();
- //Text plus
- if(this.editorSymbolChooser.type == "text")
+
+ //If text plus
+ if(this.editorSymbolChooser.type == "text"){
this.editorUpdateTextPlus();
+ }
+ else if(this._editorConfig["graphicCurrent"]){
+ //If in modification, update graphic symbology
+ this._editorConfig["graphicCurrent"].setSymbol(this.editorSymbolChooser.getSymbol());
+ }
+
//Phantom for marker
- else if(this.editorSymbolChooser.type == "marker")
+ if(this.editorSymbolChooser.type == "marker")
this.editorUpdateMapPreview(this.editorSymbolChooser.getSymbol());
- //If in modification, update graphic symbology
- if(this._editorConfig["graphicCurrent"])
- this._editorConfig["graphicCurrent"].setSymbol(this.editorSymbolChooser.getSymbol());
-
})));
//bind unit events
@@ -1124,7 +1148,42 @@ define([
this._UTIL__enableClass(this.editorTextPlusUnderlineNode, 'selected', this._editorConfig["drawPlus"]["underline"]);
this.editorUpdateTextPlus();
}));
-
+ this.onEditorTextPlusPlacementClick=lang.hitch(this, function(evt){
+ if(!evt.target)
+ return;
+
+ var selected = false;
+ for(var i in this._editorTextPlusPlacements){
+ var is_this = (evt.target == this._editorTextPlusPlacements[i]);
+
+ this._UTIL__enableClass(this._editorTextPlusPlacements[i], 'selected', is_this);
+
+ if(is_this)
+ selected = this._editorTextPlusPlacements[i];
+ }
+ if(!selected.title)
+ return;
+ var tab = selected.title.split(" ");
+ this._editorConfig["drawPlus"]["placement"] = {
+ "vertical" : tab[0],
+ "horizontal" : tab[1],
+ }
+ this.editorUpdateTextPlus();
+ });
+ this._editorTextPlusPlacements = [
+ this.editorTextPlusPlacementTopLeft,
+ this.editorTextPlusPlacementTopCenter,
+ this.editorTextPlusPlacementTopRight,
+ this.editorTextPlusPlacementMiddleLeft,
+ this.editorTextPlusPlacementMiddleCenter,
+ this.editorTextPlusPlacementMiddleRight,
+ this.editorTextPlusPlacementBottomLeft,
+ this.editorTextPlusPlacementBottomCenter,
+ this.editorTextPlusPlacementBottomRight
+ ];
+ for(var i in this._editorTextPlusPlacements)
+ on(this._editorTextPlusPlacements[i], "click",this.onEditorTextPlusPlacementClick);
+
},
_menuInit : function () {
@@ -1297,7 +1356,7 @@ define([
//Create symbol chooser
this.editorSymbolChooser = new SymbolChooser(
{
- class : "full-width",
+ "class" : "full-width",
"type" : "text",
"symbol" : new SimpleMarkerSymbol()
},
diff --git a/css/style.css b/css/style.css
index 38be715..6d22547 100644
--- a/css/style.css
+++ b/css/style.css
@@ -354,4 +354,85 @@
}
.jimu-widget-edraw .draw-plus.text-options div.draw-plus.text-option.text-underline {
text-decoration: underline;
+}
+
+.jimu-widget-edraw .draw-plus.text-place {
+ position:relative;
+ width:80px;
+ height:80px;
+ border-radius:5px;
+ border:1px solid lightgrey;
+}
+.jimu-widget-edraw .draw-plus.text-place span{
+ position:absolute;
+ width:20px;
+ height:20px;
+ border-radius:3px;
+ border:1px solid grey;
+ background-color: #E4E4E4;
+ line-height:50%;
+}
+.jimu-widget-edraw .draw-plus.text-place span.selected{
+ background-color: #C0C0C0;
+}
+.jimu-widget-edraw .draw-plus.text-place span:hover{
+ background-color: #C8C8E4;
+ cursor:pointer;
+}
+.jimu-widget-edraw .draw-plus.text-place span.selected:hover{
+ background-color: #B3B3D9;
+}
+.jimu-widget-edraw .draw-plus.text-place .text-place-top-left{
+ top:55px;
+ left:55px;
+ text-align: right;
+ vertical-align:top;
+}
+.jimu-widget-edraw .draw-plus.text-place .text-place-top-center{
+ top:55px;
+ left:30px;
+ text-align: center;
+ vertical-align:top;
+}
+.jimu-widget-edraw .draw-plus.text-place .text-place-top-right{
+ top:55px;
+ left:5px;
+ text-align: right;
+ vertical-align:top;
+}
+.jimu-widget-edraw .draw-plus.text-place .text-place-middle-left{
+ top:30px;
+ left:55px;
+ text-align: left;
+ line-height:100%;
+}
+.jimu-widget-edraw .draw-plus.text-place .text-place-middle-center{
+ top:30px;
+ left:30px;
+ text-align: center;
+ line-height:100%;
+}
+.jimu-widget-edraw .draw-plus.text-place .text-place-middle-right{
+ top:30px;
+ left:5px;
+ text-align: right;
+ line-height:100%;
+}
+.jimu-widget-edraw .draw-plus.text-place .text-place-bottom-left{
+ top:5px;
+ left:55px;
+ text-align: left;
+ padding-top: 10px;
+}
+.jimu-widget-edraw .draw-plus.text-place .text-place-bottom-center{
+ top:5px;
+ left:30px;
+ text-align: center;
+ padding-top: 10px;
+}
+.jimu-widget-edraw .draw-plus.text-place .text-place-bottom-right{
+ top:5px;
+ left:5px;
+ text-align: right;
+ padding-top: 10px;
}
\ No newline at end of file
diff --git a/nls/fr/strings.js b/nls/fr/strings.js
index 5b96ee2..7efd92e 100644
--- a/nls/fr/strings.js
+++ b/nls/fr/strings.js
@@ -79,6 +79,7 @@ define(
addMessage:'Vous pouvez maintenant faire votre dessin sur la carte',
editMessage:'NB : vous pouvez modifier/déplacer la géométrie sur la carte',
snappingMessage:'NB : l\'accrochage est possible (utiliser la touche CTRL)',
- hideOption:'Cacher les dessins'
+ hideOption:'Cacher les dessins',
+ textPlacement:'Placement'
})
);
\ No newline at end of file
diff --git a/nls/strings.js b/nls/strings.js
index d9ee686..311f4e2 100644
--- a/nls/strings.js
+++ b/nls/strings.js
@@ -79,7 +79,8 @@ define({
addMessage:'You can now make your drawing on map',
editMessage:'NB : you can modify/moove geometry on map',
snappingMessage:'NB : snapping is allowed (use CTRL)',
- hideOption:'Hide drawings'
+ hideOption:'Hide drawings',
+ textPlacement:'Placement'
}),
"ar": 1,
"cs": 1,
|