Class model property show up fix

Author: nikitaeverywhere

package.json

@@ -2,7 +2,7 @@
   "name": "cache-visual-editor",
   "printableName": "Cache Visual Editor",
   "packageName": "VisualEditor",
-  "version": "0.9.2",
+  "version": "0.9.3",
   "description": "Visual class editor for InterSystems Caché",
   "main": "index.js",
   "keywords": [

source/client/js/classEditor/class/index.js

@@ -6,9 +6,10 @@ import { getMemberBlock } from "./member";
 /**
  * This function returns card element that may be applied to the grid.
  * @param {*} data
+ * @param {*} [serviceData] - Object with additional properties passed through all the members.
  * @returns {HTMLElement}
  */
-export function getClassElement (data) {
+export function getClassElement (data, serviceData = {}) {
 
     let type = data["_type"],
         card = block(`div`, `card ${ type }`),
@@ -19,7 +20,8 @@ export function getClassElement (data) {
         }`),
         header = block(`div`, `header`);
 
-    data[`__visualClassElement`] = card;
+    serviceData[`visualClassElement`] = card;
+    serviceData[`cardWidth`] = 1;
 
     if (type === "class") // float priority
         head.appendChild(controls);
@@ -35,10 +37,10 @@ export function getClassElement (data) {
         return card;
     }
 
-    head.appendChild(getMemberBlock({ classData: data, classBlockElement: card }));
+    head.appendChild(getMemberBlock({ classData: data, classBlockElement: card, serviceData }));
     MEMBER_SECTIONS.forEach(mName => {
         if (data[mName] && Object.keys(data[mName]).length)
-            card.appendChild(getMemberSection(mName, data));
+            card.appendChild(getMemberSection(mName, data, serviceData));
     });
 
     return card;

source/client/js/classEditor/class/member.js

@@ -74,9 +74,10 @@ function getMemberDetailedBlock (classData, memberType, classMemberName) {
  * @param [classBlockName]
  * @param [classBlockPropName]
  * @param [classBlockElement]
+ * @param {*} [serviceData] - Object with additional properties passed through all the members.
  */
 function enableMember ({
-    headerElement, classData, classBlockName, classBlockPropName, classBlockElement
+    headerElement, classData, classBlockName, classBlockPropName, classBlockElement, serviceData
 }) {
 
     let isClass = !classBlockName,
@@ -86,8 +87,8 @@ function enableMember ({
             ? [classData["Name"]]
             : [classData["Name"], classBlockName, classBlockPropName];
 
-    if (typeof classData[`__visualCodeBlocksOpened`] === "undefined")
-        classData[`__visualCodeBlocksOpened`] = 0;
+    if (typeof serviceData[`visualCodeBlocksOpened`] === "undefined")
+        serviceData[`visualCodeBlocksOpened`] = 0;
 
     headerElement.addEventListener(`click`, () => {
         if (!container) {
@@ -192,9 +193,9 @@ function enableMember ({
         headerElement.classList.toggle("opened");
 
         if (classBlockName === "Methods" || classBlockName === "XDatas") {
-            classData[`__visualCodeBlocksOpened`] += opened ? 1 : -1;
-            updateGridElement(classData[`__visualClassElement`], {
-                width: classData[`__visualCodeBlocksOpened`] > 0 ? 2 : 1
+            serviceData[`visualCodeBlocksOpened`] += opened ? 1 : -1;
+            updateGridElement(serviceData[`visualClassElement`], {
+                width: serviceData[`cardWidth`] = serviceData[`visualCodeBlocksOpened`] > 0 ? 2 : 1
             });
         }
 
@@ -221,10 +222,11 @@ function getMemberIconsBlock (isClass, memberData) {
  * @param [classBlockName]
  * @param [classBlockPropName]
  * @param {HTMLElement} classBlockElement
+ * @param {*} [serviceData] - Object with additional properties passed through all the members.
  * @returns {HTMLElement}
  */
 export function getMemberBlock ({
-    classData, classBlockName, classBlockPropName, classBlockElement
+    classData, classBlockName, classBlockPropName, classBlockElement, serviceData
 }) {
 
     let isClass = !classBlockName,
@@ -248,7 +250,8 @@ export function getMemberBlock ({
     }
     item.appendChild(text);
     enableMember({
-        headerElement: item, classData, classBlockName, classBlockPropName, classBlockElement
+        headerElement: item, classData, classBlockName, classBlockPropName, classBlockElement,
+        serviceData
     });
     div.appendChild(item);
 

source/client/js/classEditor/class/memberSection.js

@@ -50,9 +50,10 @@ function getMemberControls (body, classData, classBlockName) {
  * Applies block markup according to class metadata.
  * @param {"Parameters"|"Properties"|"Methods"|"Queries"|"XDatas"|"Indices"} classBlockName
  * @param {*} classData - Class metadata.
+ * @param {*} [serviceData] - Object with additional properties passed through all the members.
  * @returns {Element}
  */
-export function getMemberSection (classBlockName, classData) {
+export function getMemberSection (classBlockName, classData, serviceData) {
 
     let section = block(`div`, `section`), body;
 
@@ -67,7 +68,9 @@ export function getMemberSection (classBlockName, classData) {
     section.appendChild(header);
     section.appendChild(body);
     for (let classBlockPropName in classData[classBlockName]) {
-        body.appendChild(getMemberBlock({classData, classBlockName, classBlockPropName}));
+        body.appendChild(getMemberBlock({
+            classData, classBlockName, classBlockPropName, serviceData
+        }));
     }
 
     return section;