Add the possibility to select parent component

GrapesJS · Sep 21, 2017 · f0e73a8 · f0e73a8
1 parent 834f464
commit f0e73a8
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 11 deletions.
diff --git a/index.html b/index.html
@@ -1037,15 +1037,7 @@ <h1 class="heading">Insert title here</h1>
         sectors: [{
           name: 'General',
           open: false,
-          buildProps: ['opacity', 'float', 'display', 'position', 'top', 'right', 'left', 'bottom'],
-          properties: [{
-            type: 'slider',
-            property: 'opacity',
-            defaults: 1,
-            step: 0.01,
-            max: 1,
-            min:0,
-          }]
+          buildProps: ['float', 'display', 'position', 'top', 'right', 'left', 'bottom']
         },{
           name: 'Dimension',
           open: false,
@@ -1070,7 +1062,15 @@ <h1 class="heading">Insert title here</h1>
         },{
           name: 'Extra',
           open: false,
-          buildProps: ['transition', 'perspective', 'transform'],
+          buildProps: ['opacity', 'transition', 'perspective', 'transform'],
+          properties: [{
+            type: 'slider',
+            property: 'opacity',
+            defaults: 1,
+            step: 0.01,
+            max: 1,
+            min:0,
+          }]
         },{
             name: 'Flex',
             open: false,

diff --git a/src/commands/index.js b/src/commands/index.js
@@ -100,6 +100,7 @@ module.exports = () => {
       defaultCommands['open-blocks'] = require('./view/OpenBlocks');
       defaultCommands['open-assets'] = require('./view/OpenAssets');
       defaultCommands['show-offset'] = require('./view/ShowOffset');
+      defaultCommands['select-parent'] = require('./view/SelectParent');
       defaultCommands.fullscreen = require('./view/Fullscreen');
       defaultCommands.preview = require('./view/Preview');
       defaultCommands.resize = require('./view/Resize');
@@ -117,7 +118,6 @@ module.exports = () => {
           ed.select(null);
           sel.destroy();
           ed.trigger('change:canvasOffset');
-          //ed.refresh();//change:canvasOffset
         },
       };
 

diff --git a/src/commands/view/SelectParent.js b/src/commands/view/SelectParent.js
@@ -0,0 +1,9 @@
+module.exports = {
+
+  run(editor) {
+    const comp = editor.getSelected();
+    const coll = comp && comp.collection;
+    coll && coll.parent && editor.select(coll.parent);
+  }
+
+};
diff --git a/src/dom_components/model/Component.js b/src/dom_components/model/Component.js
@@ -190,6 +190,12 @@ module.exports = Backbone.Model.extend(Styleable).extend({
     var model = this;
     if(!model.get('toolbar')) {
       var tb = [];
+      if(model.collection) {
+        tb.push({
+          attributes: {class: 'fa fa-arrow-up'},
+          command: 'select-parent',
+        });
+      }
       if(model.get('draggable')) {
         tb.push({
           attributes: {class: 'fa fa-arrows'},