Fix #13. Trigger collapse/expand node by double click.

alibaba · Nov 20, 2017 · 33726b8 · 33726b8
1 parent cad0678
commit 33726b8
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 13 deletions.
diff --git a/README.md b/README.md
@@ -73,8 +73,6 @@ You can find all these commands by [`Command Palette`](http://flight-manual.atom
 
 ## Icon alphabet meaning
 
-- `U` : Unknown
-
 ##### HTML
 
 - `<>` : Element
@@ -90,7 +88,11 @@ You can find all these commands by [`Command Palette`](http://flight-manual.atom
 - `I` : Import
 - `F` : Function
 - `M` : Method
-- `V`: Variable
+- `V` : Variable
+
+#### Others
+
+- `U` : Unknown
 
 
 

diff --git a/lib/structure-view.js b/lib/structure-view.js
@@ -36,6 +36,11 @@ export default class StructureView {
             toggle: true
           });
         },
+        onSelectTreeNode(evt) {
+          Util.selectTreeNode($(evt.target), this, {
+            toggle: false
+          });
+        }
       },
       watch: {
         treeNodeId(val) {
@@ -274,15 +279,14 @@ export default class StructureView {
       if (item.child) {
           let childContent = self.treeGenerator(item.child);
 
-          if (childContent.length != 0)
-          {
-          entry = `<li node-id="${item.id}" class="list-nested-item expanded" title="${item.name}">
-                      <div class="list-item symbol-mixed-block">
-                          ${iconTpl}
-                          <span>${item.name}</span>
-                      </div>
-                      <ol class="list-tree">${childContent}</ol>
-                  </li>`;
+          if (childContent.length != 0) {
+            entry = `<li node-id="${item.id}" class="list-nested-item expanded" title="${item.name}">
+                        <div class="list-item symbol-mixed-block">
+                            ${iconTpl}
+                            <span>${item.name}</span>
+                        </div>
+                        <ol class="list-tree">${childContent}</ol>
+                    </li>`;
           }
       }
 

diff --git a/lib/util.js b/lib/util.js
@@ -25,11 +25,16 @@ export default {
     if ($target.is('span')) $target = $target.parent();
     if ($target.is('div')) $target = $target.parent();
     if ($target.is('li')) {
+      // ".toggle" would be TRUE if it's double click
       if (opts && opts.toggle) {
         $target.hasClass('list-nested-item') && $target[$target.hasClass('collapsed') ? 'removeClass' : 'addClass']('collapsed');
       }
       let oldVal = vm.treeNodeId,
         val = $target.attr('node-id');
+
+      // Same node
+      if (oldVal === val) return;
+
       oldVal && $('div.structure-view>div.tree-panel>ol').find('li.selected').removeClass('selected');
       $target.addClass('selected');
       vm.treeNodeId = val;

diff --git a/styles/structure-view.less b/styles/structure-view.less
@@ -27,6 +27,10 @@
     margin-right: 2px;
   }
 
+  .full-menu {
+    user-select: none;
+  }
+
   div.symbol-mixed-block {
     display: flex;
     align-items: center;

diff --git a/templates/structure-view.html b/templates/structure-view.html
@@ -1,7 +1,7 @@
 <div class='structure-view'>
   <div class="no-file-hint" v-show="noTagHint"><pre>{{noTagHint}}</pre></div>
   <div class="tree-panel" v-show="!noTagHint">
-    <ol class="full-menu list-tree has-collapsable-children" @click="onToggleTreeNode">
+    <ol class="full-menu list-tree has-collapsable-children" @click="onSelectTreeNode" @dblclick="onToggleTreeNode">
     </ol>
   </div>
   <div class="mask">