Add object name in property page

evolus · Dec 31, 2022 · e6e534d · e6e534d
1 parent 43091dc
commit e6e534d
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 12 deletions.
diff --git a/app/views/editors/SharedPropertyEditor.js b/app/views/editors/SharedPropertyEditor.js
@@ -9,7 +9,7 @@ __extend(BaseTemplatedWidget, SharedPropertyEditor);
 SharedPropertyEditor.prototype.setup = function () {
     this.propertyContainer.innerHTML = "";
     var thiz = this;
-    
+
     var handleUpdatePageProperties = function () {
         if (thiz.updatePagePropertiesTimer) window.clearTimeout(thiz.updatePagePropertiesTimer);
         thiz.updatePagePropertiesTimer = window.setTimeout(function () {
@@ -75,7 +75,6 @@ SharedPropertyEditor.prototype.validationEditorUI = function() {
 };
 
 SharedPropertyEditor.prototype.attach = function (target) {
-
     if (!target) return;
     if (target && target.getAttributeNS && target.getAttributeNS(PencilNamespaces.p, "locked") == "true") { return; }
 
@@ -126,6 +125,8 @@ SharedPropertyEditor.prototype.attach = function (target) {
     var definedGroups = this.target.getPropertyGroups();
     this.propertyEditor = {};
     this.propertyContainer.innerHTML = "";
+    this.addPropertyTitle(this.target.def ? this.target.def.displayName : "");
+
     var definedGroups = this.target.getPropertyGroups();
     var groupNodes = [];
 
@@ -209,12 +210,14 @@ SharedPropertyEditor.prototype.attach = function (target) {
                 });
 
                 currentGroupNode._group = property._group;
-                var titleNode = Dom.newDOMElement({
-                    _name: "div",
-                    _text: property._group.name,
-                    "class": "Label Group"
-                });
-                currentGroupNode.appendChild(titleNode);
+                if (definedGroups.length > 1) {
+                    var titleNode = Dom.newDOMElement({
+                        _name: "div",
+                        _text: property._group.name,
+                        "class": "Label Group"
+                    });
+                    currentGroupNode.appendChild(titleNode);
+                }
                 thiz.propertyContainer.appendChild(currentGroupNode);
                 groupNodes.push(currentGroupNode);
             }
@@ -297,11 +300,20 @@ SharedPropertyEditor.prototype.setDefaultProperties = function() {
     }
 }
 
+SharedPropertyEditor.prototype.addPropertyTitle = function (title) {
+    var title = Dom.newDOMElement({
+        _name: "strong",
+        _text: title,
+        "class": "ObjectTitle"
+    });
+    this.propertyContainer.appendChild(title);
+};
 SharedPropertyEditor.prototype.detach = function () {
     this.propertyContainer.innerHTML = "";
     this.target = null;
     if (Pencil.controller.activePage) {
         this.node().setAttribute("mode", "Page");
+        this.addPropertyTitle(Pencil.controller.activePage.name);
         this.pagePropertyWidget = new PageDetailDialog();
         this.pagePropertyWidget.setup({
             defaultPage : Pencil.controller.activePage,

diff --git a/app/views/editors/SharedPropertyEditor.xhtml b/app/views/editors/SharedPropertyEditor.xhtml
@@ -5,7 +5,7 @@
         body .widget_SharedPropertyEditor[mode="Page"] @noTargetMessagePane {
             display: none;
         }
-        
+
         button {
             box-shadow: none;
         }
@@ -17,6 +17,10 @@
             font-size: 0.9em;
             padding: 0.5em;
         }
+        @propertyContainer .ObjectTitle {
+            font-size: 1.2em;
+            margin-bottom: 0.5em;
+        }
         @propertyContainer > .Group + .Group {
             margin-top: 2em;
         }
@@ -74,7 +78,6 @@
         @propertyContainer > .Group > div.Label.Group {
             font-weight: bold;
             margin-left: -1em;
-            text-shadow: 1px 1px 0px lighten(@app_bg, 20%);
         }
         @propertyContainer > .Group > .Wrapper > div.Label {
             white-space: nowrap;
@@ -156,7 +159,7 @@
             flex-direction: column;
             -webkit-flex-direction: column;
             display: flex;
-            
+
             align-items: start;
             & > * {
                 margin-left: 0px;
@@ -179,7 +182,7 @@
         body .widget_SharedPropertyEditor[mode="Page"] @propertyContainer .Form .Description {
             margin-bottom: 0px;
         }
-        
+
     </style>
     <vbox anon-id="noTargetMessagePane" flex="1">
         <span>Select objects in the canvas to edit properties.</span>