✨ Open in Opposite Panel

The capital O in normal mode will open either the directory the cursor is on or the directory the cursor is in if not on a directory in the opposite panel.

Author: raguay

README.md

@@ -213,6 +213,7 @@ file in the default file editor.
 | `:` | toggleCommandPrompt |
 | `.` | reRunLastCommand |
 | `,` | toggleFilter |
+| `O` | openOppositePanel |
 
 ### Visual Mode
 
@@ -275,6 +276,7 @@ These commands can be ran from the command prompt. They all act upon the current
 |`Toggle Filter` | Toggles the show all and default filters. | toggleFilter |
 | `Show All Filter` | Sets to show all Entries. | setShowAllFilter |
 | `Show Only Non-System Files/Folders | Sets the default filter of not showing system files/folders. | setDefaultFilter |
+| `Open in Opposite Panel` | Opens the directory the cursor is on or the directory the cursor is in in the opposite panel. | openOppositePanel |
 
 ### Extension Commands
 

public/bundle.css.map

@@ -36,7 +36,7 @@
   {#if showGitHub}
     <GitHub 
       on:closeGitHub={(e) => {
-        showGitHub = false;
+        toggleGitHub();
       }}
     />
   {/if}
@@ -397,6 +397,8 @@
     inputState.set(localState);
     var unsubscribeKeyProcess = keyProcess.subscribe(value => {
       localKeyProcess = value;
+      console.log('Key Process changed...');
+      console.log(value);
     });
 
     // 
@@ -617,6 +619,7 @@
     commands.addCommand('Toggle Filter', 'toggleFilter', 'Toggles the show all and default filters.', toggleFilter );
     commands.addCommand('Show All Filter', 'setShowAllFilter', 'Sets to show all Entries.', setShowAllFilter);
     commands.addCommand('Show Only Non-System Files/Folders', 'setDefaultFilter', 'Sets the default filter of not showing system files/folders.', setDefaultFilter);
+    commands.addCommand('Open in Opposite Panel', 'openOppositePanel', 'Set the opposite panel to the directory under the current cursor or the directory of the current cursor.', openOppositePanel);
   }
   
   function processKey(e) {
@@ -898,6 +901,24 @@
     changeMode('visual');
   }
 
+  function openOppositePanel() {
+    var nEntry = localCurrentCursor.entry.dir;
+    if(localCurrentCursor.entry.type === 1) {
+      nEntry = localCurrentCursor.entry.fileSystem.appendPath(localCurrentCursor.entry.dir, localCurrentCursor.entry.name);
+    }
+    if(localCurrentCursor.pane === 'right') {
+      changeDir({
+        path: nEntry,
+        cursor: true
+      },'left');
+    } else {
+      changeDir({
+        path: nEntry,
+        cursor: true
+      },'right');
+    }
+  }
+
   function cursorToPane(npane) {
     if(npane == 'right') {
       currentCursor.set({
@@ -1748,6 +1769,13 @@
 
   function toggleGitHub() {
     showGitHub = !showGitHub;
+    if(showGitHub) {
+      keyProcess.set(false);
+      localKeyProcess = false;
+    } else {
+      keyProcess.set(true);
+      localKeyProcess = true;
+    }
   }
 
   function setShowAllFilter() {
@@ -1936,6 +1964,12 @@
       meta: false,
       key: ',',
       command: "toggleFilter"
+    }, {
+      ctrl: false,
+      shift: true,
+      meta: false,
+      key: 'O',
+      command: "openOppositePanel"
     }];
     
     // 

public/bundle.js

@@ -4,7 +4,7 @@
              max-height: {getHeight()}px;
              width: {width !== null ? width : 100}px;
              color: {$theme.textColor};" 
-             on:blur={(e) => { exitGitHub(); }}
+      on:blur={(e) => { exitGitHub(); }}
 >
   <div id='GitHubHeader'>
     <h3>GitHub Themes and Extensions Importer</h3>
@@ -17,7 +17,10 @@
      X
     </span>
   </div>
-  <div id='GitHubList'>
+  <div id='GitHubList'
+       bind:this={pickerDOM}
+       on:keydown={inputChange}
+  >
     {#await repos}
       <h3>Loading Extensions Repositories....</h3>
     {:then value}
@@ -208,10 +211,11 @@
 </style>
 
 <script>
-  import { createEventDispatcher, onMount } from 'svelte';
+  import { createEventDispatcher, onMount, afterUpdate } from 'svelte';
   import { get } from 'svelte/store';
   import { theme } from '../stores/theme.js';
   import { config } from '../stores/config.js';
+  import { keyProcess } from '../stores/keyProcess.js';
   import util from '../modules/util.js';
   import { Octokit } from "@octokit/rest";
 
@@ -222,11 +226,23 @@
   var themes;
   var width = null;
   var msgs = [];
+  var pickerDOM;
 
   onMount(() => {
+    keyProcess.set(false);
     width = window.innerWidth - 30;
     octok = new Octokit();
     loadRepoInfo();
+    setTimeout(() => {
+      keyProcess.set(false);
+      if(typeof pickerDOM !== 'undefined') pickerDOM.focus();
+    }, 1000);
+  });
+
+  afterUpdate(() => {
+    if(typeof pickerDOM !== 'undefined') {
+      pickerDOM.focus();
+    }
   });
 
   function loadRepoInfo() {
@@ -252,6 +268,7 @@
   }
 
   function exitGitHub() {
+    keyProcess.set(true);
     dispatch('closeGitHub',{});
   }
 
@@ -369,5 +386,36 @@
     themes = themes;
     repos = repos;
   }
+  
+  function inputChange(e) {
+    console.log('GitHub key Processing...');
+    
+    if((e.key === 'ArrowUp')||(e.key === 'k')) {
+      // 
+      // Go up the list. Zero is at the top.
+      //
+      scrollDOM(-1);
+    } else if((e.key === 'ArrowDown')||(e.key === 'j')) {
+      // 
+      // Go down the list. The largest index is at the bottom.
+      //
+      scrollDOM(1);
+    } else if(e.key === 'Escape') {
+      //
+      // Escape key. Just exit without doing anything.
+      //
+      exitGitHub();
+    }
+  } 
+
+  function scrollDOM(amount) {
+    var adj = amount * 20;
+
+    if(pickerDOM !== null) {
+      pickerDOM.scrollTop += adj;
+      if(pickerDOM.scrollTop < 0) pickerDOM.scrollTop = 0;
+      if(pickerDOM.scrollTop > pickerDOM.clientHeight) pickerDOM.scrollTop = pickerDOM.clientHeight;
+    }
+  }
 </script>