config-surfingkeys.js

Hints.characters = 'yuiophjklnm'; // for right hand

// Disable by default on certain domains
// Instead of pressing alt+s
// settings.blacklistPattern = /.*mail.google.com.*|todoist.com\/app/i;

map(';pa', ':setProxyMode clear');

// Vim editor bindings
aceVimMap('jk', '<Esc>', 'insert');

// an example to replace `T` with `gt`, click `Default mappings` to see how `T` works.
map('gt', 'T');

// Use J/K for back/forward
map('J', 'S');
map('K', 'D');

// Use H/L to move between tabs
map('H', 'E');
map('L', 'R');

// an example to remove mapkey `Ctrl-i`
// unmap('<Ctrl-i>');
iunmap(":");

mapkey('<Ctrl-b>', 'Choose a tab with omnibar', function() {
    Front.openOmnibar({type: "Tabs"});
});

mapkey('yY', 'Copy URLs of all tabs', function() {
    RUNTIME('getTabs', null, (response) => {
      Clipboard.write(response.tabs.map(tab => tab.url).join('\n'));
    });
});

mapkey('yd', 'Copy current page as markdown link', function() {
      Clipboard.write(`[${document.title}](${window.location.href})`);
});

mapkey('yD', 'Copy all tabs as markdown links', function() {
    RUNTIME('getTabs', null, (response) => {
      Clipboard.write(response.tabs.map(tab =>
        `[${tab.title}](${tab.url})`).join('\n'));
    });
});

// Site-Specific JavaScript snippets
// Copy commands start with `yx`
mapkey('yxi', 'Copy commit SHA', function() {
  let { href: link } = document.location
  let { textContent: SHA } = document.querySelector('.sha.user-select-contain')

  Clipboard.write(`${SHA.substr(0, 6)}`)
},{domain: /github\.com\/.*\/commit/i});

mapkey('yxm', 'Copy commit SHA markdown link', function() {
  let { href: link } = document.location
  let { textContent: SHA } = document.querySelector('.sha.user-select-contain')

  Clipboard.write(`[${SHA.substr(0, 6)}](${link})`)
},{domain: /github\.com\/.*\/commit/i});

mapkey('yxs', 'Copy commit summary as markdown link', function() {
  let { href: link } = document.location
  let { textContent: SHA } = document.querySelector('.sha.user-select-contain')
  let { textContent: summary } = document.querySelector('.commit-title')

  Clipboard.write(`[(${SHA.substr(0, 6)}) ${summary.trim()}](${link})`)
},{domain: /github\.com\/.*\/commit/i});

mapkey('yxd', 'Copy commit diff', function() {
  let { href: link } = document.location
  // .blob-code-addition => '+    '
  // .blob-code-deletion => '-    '
  // .blob-code-hunk => '    {{hunk innerText}}'
  // .blob-code => '    {{code innerText}}'
  let { textContent: SHA } = document.querySelector('.sha.user-select-contain')
  let { textContent: summary } = document.querySelector('.commit-title')

  let result = [...document.querySelectorAll('#files .file ')]
    .map((file) => {
      // TODO: file/metadata at top
      // let { innerText: file } = document.querySelectorAll('.file-info a')
      // .diff-table tr

      let codeEl = row.querySelector('.blob-code')
      let prefix = ''
      if (codeEl.className.indexOf('-addition') > -1) prefix = '+'
      else if (codeEl.className.indexOf('-deletion') > -1) prefix = '-'

      let { innerText: content } = codeEl
      return `${prefix + content}`
    })
    .join('\n')

  Clipboard.write(`${result}`)
},{domain: /github\.com\/.*\/commit/i});

mapkey('yxi', 'Copy Jira Issue ID', function() {
  let { textContent: issueKey } = document.querySelector('#key-val')
  Clipboard.write(`${issueKey}`)
},{domain: /.*jira.*\.com\/.*browse.*/i});

mapkey('yxs', 'Copy Jira Issue ID With Summary', function() {
  let { textContent: issueKey } = document.querySelector('#key-val')
  let { textContent: issueSummary } = document.querySelector('#summary-val')

  Clipboard.write(`${issueKey} ${issueSummary}`)
},{domain: /.*jira.*\.com\/.*browse.*/i});

mapkey('yxd', 'Copy Jira Issue Markown Link', function() {
  let { textContent: issueKey, href: issueLink } = document.querySelector('#key-val')
  let { textContent: issueSummary } = document.querySelector('#summary-val')

  Clipboard.write(`[${issueKey} ${issueSummary}](${issueLink})`)
},{domain: /.*jira.*\.com\/.*browse.*/i});

// Set theme
// https://github.com/Foldex/surfingkeys-config
// ---- Hints ----
// Hints have to be defined separately
// Uncomment to enable

// Nord
Hints.style('border: solid 2px #4C566A; color:#EBCB8B; background: initial; background-color: #3B4252; font-size: 13px;');
Hints.style("border: solid 2px #4C566A !important; padding: 1px !important; color: #E5E9F0 !important; background: #3B4252 !important;", "text");
Visual.style('marks', 'background-color: #A3BE8C99;');
Visual.style('cursor', 'background-color: #88C0D0;');

// Doom One
/* -- DELETE LINE TO ENABLE THEME
Hints.style('border: solid 2px #282C34; color:#98be65; background: initial; background-color: #2E3440;');
Hints.style("border: solid 2px #282C34 !important; padding: 1px !important; color: #51AFEF !important; background: #2E3440 !important;", "text");
Visual.style('marks', 'background-color: #98be6599;');
Visual.style('cursor', 'background-color: #51AFEF;');
-- DELETE LINE TO ENABLE THEME */

settings.theme = `
/* Edit these variables for easy theme making */
:root {
  /* Font */
  --font: 'Fira Code', Inconsolata, monospace;
  --font-size: 18;
  --font-normal: normal;
  --font-strong: bold;

  /* -------------- */
  /* --- THEMES --- */
  /* -------------- */

  /* -------------------- */
  /* --      NORD      -- */
  /* -------------------- */
  --fg: #E5E9F0;
  --bg: #3B4252;
  --bg-dark: #2E3440;
  --border: #4C566A;
  --main-fg: #88C0D0;
  --accent-fg: #A3BE8C;
  --info-fg: #5E81AC;
  --select: #4C566A;

  /* Unused Alternate Colors */
  /* --orange: #D08770; */
  /* --red: #BF616A; */
  /* --yellow: #EBCB8B; */

  /* -------------------- */
  /* --    DOOM ONE    -- */
  /* -------------------- */
  /* -- DELETE LINE TO ENABLE THEME
  --fg: #51AFEF;
  --bg: #2E3440;
  --bg-dark: #21242B;
  --border: #282C34;
  --main-fg: #51AFEF;
  --accent-fg: #98be65;
  --info-fg: #C678DD;
  --select: #4C566A;
  -- DELETE LINE TO ENABLE THEME */

  /* Unused Alternate Colors */
  /* --bg-dark: #21242B; */
  /* --main-fg-alt: #2257A0; */
  /* --cyan: #46D9FF; */
  /* --orange: #DA8548; */
  /* --red: #FF6C6B; */
  /* --yellow: #ECBE7B; */
}

/* ---------- Generic ---------- */
.sk_theme {
background: var(--bg);
color: var(--fg);
  background-color: var(--bg);
  border-color: var(--border);
  font-family: var(--font);
  font-size: var(--font-size);
  font-weight: var(--font-normal);
}

input {
  font-family: var(--font);
  font-weight: var(--font-strong);
}

.sk_theme tbody {
  color: var(--fg);
}

.sk_theme input {
  color: var(--fg);
}

/* Hints */
#sk_hints .begin {
  color: var(--accent-fg) !important;
}

#sk_tabs .sk_tab {
  background: var(--bg-dark);
  border: 1px solid var(--border);
  color: var(--fg);
}

#sk_tabs .sk_tab_hint {
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--accent-fg);
}

.sk_theme #sk_frame {
  background: var(--bg);
  opacity: 0.2;
  color: var(--accent-fg);
}

/* ---------- Omnibar ---------- */
/* Uncomment this and use settings.omnibarPosition = 'bottom' for Pentadactyl/Tridactyl style bottom bar */
/* .sk_theme#sk_omnibar {
  width: 100%;
  left: 0;
} */

.sk_theme .title {
  color: var(--accent-fg);
}

.sk_theme .url {
  color: var(--main-fg);
}

.sk_theme .annotation {
  color: var(--accent-fg);
}

.sk_theme .omnibar_highlight {
  color: var(--accent-fg);
}

.sk_theme .omnibar_timestamp {
  color: var(--info-fg);
}

.sk_theme .omnibar_visitcount {
  color: var(--accent-fg);
}

.sk_theme #sk_omnibarSearchResult ul li:nth-child(odd) {
  background: var(--bg-dark);
}

.sk_theme #sk_omnibarSearchResult ul li.focused {
  background: var(--border);
}

.sk_theme #sk_omnibarSearchArea {
  border-top-color: var(--border);
  border-bottom-color: var(--border);
}

.sk_theme #sk_omnibarSearchArea input,
.sk_theme #sk_omnibarSearchArea span {
  font-size: var(--font-size);
}

.sk_theme .separator {
  color: var(--accent-fg);
}

/* ---------- Popup Notification Banner ---------- */
#sk_banner {
  font-family: var(--font);
  font-size: var(--font-size);
  font-weight: var(--font-normal);
  background: var(--bg);
  border-color: var(--border);
  color: var(--fg);
  opacity: 0.9;
}

/* ---------- Popup Keys ---------- */
#sk_keystroke {
  background-color: var(--bg);
}

.sk_theme kbd .candidates {
  color: var(--info-fg);
}

.sk_theme span.annotation {
  color: var(--accent-fg);
}

/* ---------- Popup Translation Bubble ---------- */
#sk_bubble {
  background-color: var(--bg) !important;
  color: var(--fg) !important;
  border-color: var(--border) !important;
}

#sk_bubble * {
  color: var(--fg) !important;
}

#sk_bubble div.sk_arrow div:nth-of-type(1) {
  border-top-color: var(--border) !important;
  border-bottom-color: var(--border) !important;
}

#sk_bubble div.sk_arrow div:nth-of-type(2) {
  border-top-color: var(--bg) !important;
  border-bottom-color: var(--bg) !important;
}

/* ---------- Search ---------- */
#sk_status,
#sk_find {
  font-size: var(--font-size);
  border-color: var(--border);
}

.sk_theme kbd {
  background: var(--bg-dark);
  border-color: var(--border);
  box-shadow: none;
  color: var(--fg);
}

.sk_theme .feature_name span {
  color: var(--main-fg);
}

/* ---------- ACE Editor ---------- */
#sk_editor {
  background: var(--bg-dark) !important;
  height: 50% !important;
  /* Remove this to restore the default editor size */
}

.ace_dialog-bottom {
  border-top: 1px solid var(--bg) !important;
}

.ace-chrome .ace_print-margin,
.ace_gutter,
.ace_gutter-cell,
.ace_dialog {
  background: var(--bg) !important;
}

.ace-chrome {
  color: var(--fg) !important;
}

.ace_gutter,
.ace_dialog {
  color: var(--fg) !important;
}

.ace_cursor {
  color: var(--fg) !important;
}

.normal-mode .ace_cursor {
  background-color: var(--fg) !important;
  border: var(--fg) !important;
  opacity: 0.7 !important;
}

.ace_marker-layer .ace_selection {
  background: var(--select) !important;
}

.ace_editor,
.ace_dialog span,
.ace_dialog input {
  font-family: var(--font);
  font-size: var(--font-size);
  font-weight: var(--font-normal);
}
`;