Refactor symbol keys

src/dom_components/model/Component.js

@@ -27,8 +27,8 @@ const escapeRegExp = str => {
 const avoidInline = em => em && em.getConfig('avoidInlineStyle');
 
 export const eventDrag = 'component:drag';
+export const keySymbols = '__symbols';
 export const keySymbol = '__symbol';
-export const keySymbolOf = '__symbol';
 export const keySymbol2w = '__symbol2w';
 
 /**
@@ -593,7 +593,7 @@ const Component = Backbone.Model.extend(Styleable).extend(
     },
 
     __isSymbol() {
-      return isArray(this.get(keySymbol));
+      return isArray(this.get(keySymbols));
     },
 
     __isSymbolTop() {
@@ -601,13 +601,13 @@ const Component = Backbone.Model.extend(Styleable).extend(
       return this.__isSymbol() && parent && !parent.__isSymbol();
     },
 
-    __getSymbolOf() {
+    __getSymbol() {
-      return this.get(keySymbolOf);
+      return this.get(keySymbol);
     },
 
     __getSymbToUp(opts = {}) {
-      const symbol = this.get(keySymbol);
+      const symbol = this.get(keySymbols);
-      const symbolOf = this.__getSymbolOf();
+      const symbolOf = this.__getSymbol();
       let result = !this.__isSymbol()
         ? []
         : symbol.filter(md => md.collection || md.prevColl);
@@ -629,7 +629,7 @@ const Component = Backbone.Model.extend(Styleable).extend(
 
       while (
         parent &&
-        (isSymbol ? parent.__isSymbol() : parent.__getSymbolOf())
+        (isSymbol ? parent.__isSymbol() : parent.__getSymbol())
       ) {
         result = parent;
         parent = parent.parent(opts);
@@ -643,8 +643,8 @@ const Component = Backbone.Model.extend(Styleable).extend(
       const attrs = changed.attributes || {};
       delete changed.status;
       delete changed.open;
+      delete changed[keySymbols];
       delete changed[keySymbol];
-      delete changed[keySymbolOf];
       delete changed.attributes;
       delete attrs.id;
       if (!isEmptyObj(attrs)) changed.attributes = attrs;
@@ -1108,14 +1108,12 @@ const Component = Backbone.Model.extend(Styleable).extend(
 
       // Symbols
       // If I clone an inner symbol, I have to reset it
-      cloned.unset(keySymbol);
+      cloned.unset(keySymbols);
       if (opt.symbol) {
-        const symbols = this.get(keySymbol) || [];
+        cloned.set(keySymbols, [this]);
-        symbols.push(cloned);
+        [this, cloned].map(i => i.__initSymb());
-        this.set(keySymbol, symbols);
+        this.set(keySymbol, cloned);
-        this.__initSymb();
+        // opt.symbol2w && cloned.set(keySymbol2w, 1);
-        cloned.set(keySymbolOf, this);
-        opt.symbol2w && cloned.set(keySymbol2w, 1);
       }
 
       const event = 'component:clone';
@@ -1260,11 +1258,11 @@ const Component = Backbone.Model.extend(Styleable).extend(
       delete obj.open; // used in Layers
 
       if (!opts.keepSymbols) {
-        if (obj.__symbol) {
+        if (obj[keySymbols]) {
-          obj.__symbol = this.__getSymbToUp().map(i => i.getId());
+          obj[keySymbols] = this.__getSymbToUp().map(i => i.getId());
         }
-        if (obj.__symbolOf) {
+        if (obj[keySymbol]) {
-          obj.__symbolOf = obj.__symbolOf.getId();
+          obj[keySymbol] = obj[keySymbol].getId();
         }
       }
 

src/dom_components/model/Components.js

@@ -9,8 +9,7 @@ import {
   flatten,
   debounce
 } from 'underscore';
-
+import Component, { keySymbol, keySymbols } from './Component';
-let Component;
 
 const getIdsToKeep = (prev, res = []) => {
   const pr = prev || [];
@@ -144,7 +143,6 @@ export default Backbone.Collection.extend({
     const cssc = em.get('CssComposer');
     const parsed = em.get('Parser').parseHtml(value);
     // We need this to avoid duplicate IDs
-    if (!Component) Component = require('./Component').default;
     Component.checkId(parsed.html, parsed.css, domc.componentsById, opt);
 
     if (parsed.css && cssc && !opt.temporary) {
@@ -179,7 +177,7 @@ export default Backbone.Collection.extend({
     models = isMult ? flatten(models, 1) : models[0];
 
     // if (parent && parent.get('__symbol2w') && !opt.__fromSymb) {
-    //   const symb = parent.__getSymbolOf();
+    //   const symb = parent.__getSymbol();
     //   console.log('Trying to add to symbol', symb, 'this models', models, opt);
     //   return symb.components().add(models, {...opt, __fromSymb: 1, });
     // } else if (parent && parent.__isSymbol()) {
@@ -275,17 +273,17 @@ export default Backbone.Collection.extend({
     const silent = { silent: true };
     const onAll = comps => {
       comps.forEach(comp => {
-        const symbol = comp.get('__symbol');
+        const symbol = comp.get(keySymbols);
-        const symbolOf = comp.get('__symbolOf');
+        const symbolOf = comp.get(keySymbol);
         if (symbol && isArray(symbol) && isString(symbol[0])) {
           comp.set(
-            '__symbol',
+            keySymbols,
             symbol.map(smb => allComp[smb]).filter(i => i),
             silent
           );
         }
         if (isString(symbolOf)) {
-          comp.set('__symbolOf', allComp[symbolOf], silent);
+          comp.set(keySymbol, allComp[symbolOf], silent);
         }
         onAll(comp.components());
       });