Merge branch 'master' of github.com:nextgis/nextgisweb

thaond · Feb 14, 2022 · 5cfc145 · 5cfc145
2 parents 4c3a267 + d7f0884
commit 5cfc145
Show file tree

Hide file tree

Showing 6 changed files with 151 additions and 113 deletions.
diff --git a/nextgisweb/webmap/amd/ngw-webmap/layers/annotations/AnnotationFeature.js b/nextgisweb/webmap/amd/ngw-webmap/layers/annotations/AnnotationFeature.js
@@ -48,12 +48,6 @@ define([
         },
 
         _buildFromAnnotationInfo: function (annotationInfo) {
-            const popup = new AnnotationsPopup(
-                this,
-                this._editable,
-                annotationInfo
-            );
-
             const geom = wkt.readGeometry(annotationInfo.geom);
             const feature = new ol.Feature({
                 geometry: geom,
@@ -66,12 +60,20 @@ define([
 
             feature.setProperties({
                 info: annotationInfo,
-                popup: popup,
                 annFeature: this,
             });
 
             this._feature = feature;
             this.calculateAccessType();
+
+            const popup = new AnnotationsPopup(
+                this,
+                this._editable,
+                annotationInfo
+            );
+            feature.setProperties({
+                popup: popup,
+            });
         },
 
         _buildFromFeature: function (feature) {
@@ -105,7 +107,9 @@ define([
         },
 
         getAnnotationInfo: function () {
-            return this._feature.get("info");
+            const feature = this.getFeature();
+            if (!feature) return null;
+            return feature.get("info");
         },
 
         getPopup: function () {
@@ -126,6 +130,26 @@ define([
             return this._accessType;
         },
 
+        getAccessTypeTitle: function () {
+            const annotationInfo = this.getAnnotationInfo();
+            if (!annotationInfo) return null;
+
+            const accessType = this.getAccessType();
+            if (!accessType) return null;
+
+            let title;
+            if (accessType === "public") {
+                title = i18n.gettext("Public annotation");
+            } else if (accessType === "own") {
+                title = i18n.gettext("My private annotation");
+            } else {
+                title =
+                    i18n.gettext(`Private annotation`) +
+                    ` (${annotationInfo.user})`;
+            }
+            return title;
+        },
+
         updateGeometry: function (geometry) {
             const annotationInfo = this._feature.get("info");
             annotationInfo.geom = wkt.writeGeometry(geometry);
@@ -198,9 +222,12 @@ define([
             this.getFeature().setStyle(visible ? this._style : hideStyle);
             this._visible = visible;
         },
-        
+
         togglePopup: function (visible, map) {
-            if ((visible && this._popupVisible) || (!visible && !this._popupVisible))
+            if (
+                (visible && this._popupVisible) ||
+                (!visible && !this._popupVisible)
+            )
                 return false;
 
             const popup = this.getPopup();
@@ -210,6 +237,6 @@ define([
                 popup.remove();
             }
             this._popupVisible = visible;
-        }
+        },
     });
 });
diff --git a/nextgisweb/webmap/amd/ngw-webmap/layers/annotations/AnnotationsPopup.js b/nextgisweb/webmap/amd/ngw-webmap/layers/annotations/AnnotationsPopup.js
@@ -49,7 +49,7 @@ define([
             this._annFeature = annotationFeature;
 
             const customCssClass = annotationInfo
-                ? `annotation ${this._getAccessCssClass(annotationInfo)}`
+                ? `annotation ${this._getAccessCssClass(annotationFeature)}`
                 : "annotation";
 
             this._popup = new olPopup({
@@ -58,39 +58,27 @@ define([
                 customCssClass,
             });
 
-            if (annotationInfo) this._setTitle(annotationInfo);
+            if (annotationInfo) this._setTitle(annotationFeature);
 
             this._popup.annFeature = annotationFeature;
             this._popup.cloneOlPopup = this.cloneOlPopup;
         },
 
-        _getAccessCssClass: function (annotationInfo) {
-            if (!annotationInfo) return "";
-            if (annotationInfo.public) return "public";
-            if (annotationInfo.own) return "own";
-            return "private";
+        _getAccessCssClass: function (annFeature) {
+            return annFeature.getAccessType();
         },
 
-        _setAccessCssClass: function (annotationInfo) {
+        _setAccessCssClass: function (annFeature) {
             if (!this._popup) return;
 
             const elPopup = this._popup.element.childNodes[0];
-            const cssClass = this._getAccessCssClass(annotationInfo);
+            const cssClass = this._getAccessCssClass(annFeature);
             domClass.add(elPopup, cssClass);
         },
 
-        _setTitle: function (annotationInfo) {
-            let title;
-            if (annotationInfo.public) {
-                title = i18n.gettext("Public annotation");
-            } else if (annotationInfo.own) {
-                title = i18n.gettext("My private annotation");
-            } else {
-                title =
-                    i18n.gettext(`Private annotation`) +
-                    ` (${annotationInfo.user})`;
-            }
-            this._popup.element.setAttribute("title", title);
+        _setTitle: function (annotationFeature) {
+            const accessTypeTitle = annotationFeature.getAccessTypeTitle();
+            this._popup.element.setAttribute("title", accessTypeTitle);
         },
 
         addToMap: function (map) {
@@ -178,9 +166,8 @@ define([
             const accessType = this._annFeature.getAccessType();
 
             if (feature && accessType) {
-                const annotationInfo = this._annFeature.getAnnotationInfo();
-                this._setTitle(annotationInfo);
-                this._setAccessCssClass(annotationInfo);
+                this._setTitle(this._annFeature);
+                this._setAccessCssClass(this._annFeature);
             }
 
             if (!this._contentWidget) return false;

diff --git a/nextgisweb/webmap/amd/ngw-webmap/ui/AnnotationsDialog/AnnotationsDialog.css b/nextgisweb/webmap/amd/ngw-webmap/ui/AnnotationsDialog/AnnotationsDialog.css
@@ -1,34 +1,34 @@
-.adt-table-horiz .dijitButtonNode.dijitArrowButton {
-  width: 10px;
+.annotation-dialog .annotation-access-type {
+  padding: 1px 2px 1px 5px;
+  margin: 0 0 9px 0;
+  color: #818181;
+  text-align: left;
+  font-size: 12px;
 }
 
-i.select-color {
-  display: inline-block;
-  width: 12px;
-  height: 12px;
-  margin-right: 5px;
+.annotation-dialog[data-access-type="empty"] .annotation-access-type {
+  display: none;
 }
 
-i.select-color.red {
-  background-color: #FF0000;
+.annotation-dialog[data-access-type="public"] .annotation-access-type {
+  border-left: #97e07e 8px solid;
+  border-bottom: #97e07e 1px solid;
+  border-top: #97e07e 1px solid;
+  border-right: #97e07e 1px solid;  
 }
 
-i.select-color.green {
-  background-color: #008000;
+.annotation-dialog[data-access-type="own"] .annotation-access-type {
+  border-left: #e8b3f8 8px solid;
+  border-bottom: #e8b3f8 1px solid;
+  border-top: #e8b3f8 1px solid;
+  border-right: #e8b3f8 1px solid;  
 }
 
-i.select-color.blue {
-  background-color: #0000FF;
+.annotation-dialog[data-access-type="private"] .annotation-access-type {
+  border-left: #f88f8f 8px solid;
+  border-bottom: #f88f8f 1px solid;
+  border-top: #f88f8f 1px solid;
+  border-right: #f88f8f 1px solid;  
 }
 
-i.select-color.yellow {
-  background-color: #FFFF00;
-}
-
-i.select-color.orange {
-  background-color: #FFA500;
-}
 
-i.select-color.black {
-  background-color: #000000;
-}
diff --git a/nextgisweb/webmap/amd/ngw-webmap/ui/AnnotationsDialog/AnnotationsDialog.js b/nextgisweb/webmap/amd/ngw-webmap/ui/AnnotationsDialog/AnnotationsDialog.js
@@ -3,10 +3,13 @@ define([
     "dojo/_base/lang",
     "dojo/dom-construct",
     "dojo/dom-style",
+    "dojo/dom-attr",
     "dojo/Deferred",
     "dojo/on",
     "dojo/Evented",
     "dojo/store/Memory",
+    "dijit/_WidgetBase",
+    "dijit/_TemplatedMixin",
     "dijit/Dialog",
     "dijit/form/Button",
     "dijit/layout/ContentPane",
@@ -31,10 +34,13 @@ define([
     lang,
     domConstruct,
     domStyle,
+    domAttr,
     Deferred,
     on,
     Evented,
     Memory,
+    _WidgetBase,
+    _TemplatedMixin,
     Dialog,
     Button,
     ContentPane,
@@ -54,18 +60,28 @@ define([
     i18n,
     AnnotationsSettings
 ) {
+    const AccessTypeSection = declare([_WidgetBase, _TemplatedMixin], {
+        templateString:
+            '<div class="annotation-access-type" data-dojo-attach-point="accessContainer"></div>',
+    });
+
     return declare([Dialog, Evented], {
         _deferred: null,
         _annFeature: null,
 
         constructor: function (options) {
             declare.safeMixin(this, options);
             this.style = "width: 400px";
+            this.class = "annotation-dialog";
         },
 
         postCreate: function () {
             this.inherited(arguments);
 
+            this.accessTypeSection = new AccessTypeSection().placeAt(
+                this.containerNode
+            );
+
             this.editor = new Editor({
                 extraPlugins: [
                     "foreColor",
@@ -89,8 +105,7 @@ define([
                     "|",
                     "createLink",
                 ],
-                style:
-                    'font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 14px;',
+                style: 'font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 14px;',
             }).placeAt(this.containerNode);
 
             this.annotationsSettings = new AnnotationsSettings().placeAt(
@@ -104,7 +119,7 @@ define([
                 },
                 this.containerNode
             );
-            
+
             this._buildCreateAnnotationBtn();
 
             this.btnSave = new Button({
@@ -126,7 +141,7 @@ define([
 
             this.onCancel = lang.hitch(this, this.onUndo);
         },
-        
+
         _buildCreateAnnotationBtn: function () {
             const menu = new DropDownMenu({ style: "display: none;" });
             const menuItemPublic = new MenuItem({
@@ -149,16 +164,16 @@ define([
 
             this.btnCreate = new DropDownButton({
                 label: i18n.gettext("Create"),
-                dropDown: menu
+                dropDown: menu,
             }).placeAt(this.actionBar);
         },
-        
+
         onCreate: function (isPublic) {
             const newData = this._updateFeatureFromDialog();
             newData.public = isPublic;
             this.save(newData);
         },
-        
+
         onSave: function () {
             const newData = this._updateFeatureFromDialog();
             this.save(newData);
@@ -260,6 +275,8 @@ define([
                 domStyle.set(this.btnSave.domNode, "display", "none");
             }
 
+            this._updateAccessSection(annFeature);
+
             this.show();
 
             this._annFeature = annFeature;
@@ -270,5 +287,13 @@ define([
         showLastData: function () {
             this.show();
         },
+
+        _updateAccessSection: function (annFeature) {
+            const accessType = annFeature.getAccessType();
+
+            this.accessTypeSection.accessContainer.innerHTML =
+                annFeature.getAccessTypeTitle();
+            domAttr.set(this.domNode, "data-access-type", accessType || "empty");
+        },
     });
 });
diff --git a/nextgisweb/webmap/amd/ngw-webmap/ui/AnnotationsDialog/AnnotationsSettings.css b/nextgisweb/webmap/amd/ngw-webmap/ui/AnnotationsDialog/AnnotationsSettings.css
@@ -29,7 +29,7 @@
   float: right;
 }
 
-.annotations-settings table .row .controls.circle-size .dijitTextBox  {
+.annotations-settings table .row .controls.circle-size .dijitTextBox {
   width: 100%;
 }
 
@@ -38,4 +38,3 @@ div.dijitPopup.Popup {
   margin-top: 1px;
   background-color: #ededed;
 }
-