搜索引擎快速切换器

search-engine-switcher.user.js

// ==UserScript==
// @name         Search Engine Switcher
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  提供更方便的方式切换搜索引擎，快捷键 Alt+S
// @author       鸿则<hungtcs@163.com>
// @match        https://www.google.com/*
// @match        https://www.baidu.com/*
// @match        https://*.bing.com/*
// @match        https://www.google.com/search*
// @match        https://cn.bing.com/search*
// @match        https://www.baidu.com/s*
// @match        https://duckduckgo.com/*
// @grant        none
// ==/UserScript==

(function() {
  'use strict';
  const containerId = `search-engine-switcher-container`;
  const engines = [
    {
      name: `Google`,
      match: /^https:\/\/www\.google\.com\/(search)?/,
      icon: `<svg t="1587723710575" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2689" width="64" height="64"><path d="M214.101333 512c0-32.512 5.546667-63.701333 15.36-92.928L57.173333 290.218667A491.861333 491.861333 0 0 0 4.693333 512c0 79.701333 18.858667 154.88 52.394667 221.610667l172.202667-129.066667A290.56 290.56 0 0 1 214.101333 512" fill="#FBBC05" p-id="2690"></path><path d="M516.693333 216.192c72.106667 0 137.258667 25.002667 188.458667 65.962667L854.101333 136.533333C763.349333 59.178667 646.997333 11.392 516.693333 11.392c-202.325333 0-376.234667 113.28-459.52 278.826667l172.373334 128.853333c39.68-118.016 152.832-202.88 287.146666-202.88" fill="#EA4335" p-id="2691"></path><path d="M516.693333 807.808c-134.357333 0-247.509333-84.864-287.232-202.88l-172.288 128.853333c83.242667 165.546667 257.152 278.826667 459.52 278.826667 124.842667 0 244.053333-43.392 333.568-124.757333l-163.584-123.818667c-46.122667 28.458667-104.234667 43.776-170.026666 43.776" fill="#34A853" p-id="2692"></path><path d="M1005.397333 512c0-29.568-4.693333-61.44-11.648-91.008H516.650667V614.4h274.602666c-13.696 65.962667-51.072 116.650667-104.533333 149.632l163.541333 123.818667c93.994667-85.418667 155.136-212.650667 155.136-375.850667" fill="#4285F4" p-id="2693"></path></svg>`,
      doSearch: (keywords) => {
        window.location = `https://www.google.com/search?q=${ keywords }`;
      },
      getKeywords: () => {
        return document.querySelector('input[name="q"][type="text"]').value;
      },
    },
    {
      name: `Baidu`,
      match: /^https:\/\/www\.baidu\.com\/(s)?/,
      icon: `<svg t="1587722536150" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1795" width="64" height="64"><path d="M345.706 297.423c15.35 12.792 35.817 20.467 53.726 17.908 20.467 0 38.375-10.233 53.725-23.025 17.91-15.35 30.7-35.817 40.934-58.842C512 189.97 512 136.245 496.65 90.194c-10.234-30.7-28.142-58.842-53.726-76.75C427.574 3.21 404.548-1.906 384.081 0.652c-12.791 2.558-25.583 7.675-38.375 15.35-23.025 15.35-38.376 40.934-48.61 66.518-12.791 46.05-15.35 92.101-2.557 138.152 10.233 28.142 25.583 56.284 51.167 76.75z m255.837 2.558c17.909 15.35 40.934 25.584 63.96 25.584 20.466 2.558 38.375-2.558 56.283-12.792 17.909-10.233 33.26-25.584 43.493-43.492 12.792-20.467 23.025-40.934 30.7-63.96 5.117-17.908 7.675-38.375 5.117-58.842-2.559-28.142-15.35-53.726-33.259-76.751-12.792-15.35-28.142-30.7-46.05-38.376-12.792-5.116-28.143-10.233-40.935-7.675-17.908 2.559-33.258 12.792-46.05 23.026-17.909 15.35-33.259 33.258-43.493 53.725-10.233 17.909-20.466 38.376-23.025 61.401-2.558 25.584-2.558 51.168 2.559 74.193 5.116 23.025 12.791 46.05 30.7 63.96zM245.929 509.768c17.91-15.35 28.143-35.818 35.818-56.285 10.233-33.258 10.233-66.517 7.675-99.776 0-12.792-5.117-25.584-10.234-38.376-12.792-28.142-35.817-53.725-63.959-69.076-23.025-10.233-46.05-15.35-66.518-10.233-25.583 2.558-46.05 20.467-61.4 40.934-20.467 28.142-30.7 63.96-35.818 97.218-2.558 20.467 0 40.934 5.117 61.4 7.675 30.701 23.025 58.843 46.05 79.31 17.91 15.35 40.935 23.026 63.96 23.026 28.142 0 56.284-7.675 79.31-28.142z m736.811-76.752c-2.558-20.467-7.675-38.375-17.908-56.284-10.234-20.467-28.143-40.934-48.61-51.167-23.025-12.792-51.167-15.35-76.75-12.792-12.792 2.558-28.143 5.117-40.935 12.792-17.908 10.233-30.7 28.142-40.933 48.609-10.234 25.584-15.35 53.726-15.35 81.868 0 25.583 0 53.726 7.674 79.31 5.117 17.908 15.35 38.375 33.26 48.608 17.908 15.35 40.933 20.467 63.959 23.026 17.908 2.558 38.375 2.558 56.284-2.559 17.908-5.116 35.817-15.35 46.05-30.7 12.792-15.35 20.467-35.817 23.026-53.726 12.792-30.7 10.233-58.842 10.233-86.985zM911.106 819.33c-2.559-35.817-20.467-71.634-46.05-99.776-5.118-5.117-10.234-10.234-17.91-15.35-33.258-28.142-66.517-58.843-99.776-89.543-33.259-33.26-63.96-69.076-92.101-107.452-20.467-33.259-48.61-63.96-86.985-81.868-23.025-10.233-51.167-15.35-76.751-12.792-46.05 5.117-86.985 30.7-115.127 66.518-7.675 7.675-12.791 17.909-17.908 28.142-20.467 30.7-46.05 61.401-74.193 86.985-15.35 15.35-30.7 28.142-46.05 40.934-7.676 7.675-17.91 15.35-25.584 23.025-30.7 23.025-61.401 53.726-79.31 86.985-12.792 23.025-20.467 48.609-23.025 76.75 0 23.026 2.558 46.051 10.233 66.518 7.675 23.026 17.909 46.051 33.26 63.96 25.583 30.7 63.958 51.167 102.334 53.725 48.609 2.559 97.218 0 143.269-7.675 20.467-2.558 40.934-10.233 63.959-12.792 46.05-5.116 92.101-2.558 135.594 10.234 35.817 12.792 74.192 17.909 112.568 20.467 38.375 2.558 79.31-2.558 115.127-23.025 25.583-12.792 46.05-35.818 58.842-61.401 20.467-33.26 30.7-71.635 25.584-112.569zM481.3 924.224H363.615c-12.792 0-25.584 0-38.376-2.559-25.584-5.117-48.61-20.467-63.96-43.492-12.791-15.35-20.466-33.259-23.025-53.726a246.563 246.563 0 0 1 0-61.4c5.117-23.026 17.909-43.493 33.26-58.843 12.791-12.792 30.7-23.026 48.608-30.7 7.675-2.56 15.35-5.117 23.026-5.117h69.076v-97.219h66.517c2.559 120.244 2.559 237.929 2.559 353.056z m263.512 0H583.634c-17.908-2.559-33.258-7.676-46.05-17.909-15.35-12.792-23.026-33.259-23.026-51.167v-173.97h66.518v161.178c0 7.675 2.558 12.792 7.675 17.908 5.117 5.117 12.792 7.675 20.467 7.675h69.076V678.62h66.518v245.604z" fill="#306CFF" p-id="1796" data-spm-anchor-id="a313x.7781069.0.i5"></path><path d="M340.59 734.904c-12.793 5.117-25.585 15.35-33.26 30.7-5.116 12.792-7.675 25.584-7.675 38.376 0 15.35 5.117 30.7 12.792 43.492 10.234 15.35 28.142 25.584 46.05 23.026h53.727V732.346H353.38c-2.558-2.559-7.675 0-12.792 2.558z" fill="#306CFF" p-id="1797"></path></svg>`,
      doSearch: (keywords) => {
        window.location = `https://www.baidu.com/s?wd=${ keywords }`;
      },
      getKeywords: () => {
        return document.querySelector('input#kw').value;
      },
    },
    {
      name: `Bing`,
      match: /^https:\/\/cn\.bing\.com\/(search)?/,
      icon: `<svg t="1587725392962" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3714" width="64" height="64"><path d="M911.36 426.666667L433.493333 238.933333c-6.826667-3.413333-13.653333 0-17.066666 3.413334-6.826667 6.826667-6.826667 13.653333-6.826667 20.48l102.4 238.933333 10.24 10.24 146.773333 40.96-416.426666 225.28 116.053333-98.986667c3.413333-3.413333 6.826667-6.826667 6.826667-13.653333V102.4c0-6.826667-3.413333-13.653333-10.24-17.066667L126.293333 0c-6.826667 0-13.653333 0-17.066666 3.413333-3.413333 3.413333-6.826667 6.826667-6.826667 13.653334v853.333333c0 3.413333 0 3.413333 3.413333 6.826667l3.413334 3.413333 3.413333 3.413333 238.933333 136.533334c3.413333 0 6.826667 3.413333 6.826667 3.413333 3.413333 0 6.826667 0 10.24-3.413333l546.133333-341.333334c3.413333-3.413333 6.826667-10.24 6.826667-13.653333V443.733333c0-6.826667-3.413333-13.653333-10.24-17.066666z" fill="#0C8484" p-id="3715"></path></svg>`,
      doSearch: (keywords) => {
        window.location = `https://cn.bing.com/search?q=${ keywords }`;
      },
      getKeywords: () => {
        return document.querySelector('input#sb_form_q').value;
      },
    },
    {
      name: `DuckDuckGo！`,
      match: /^https:\/\/duckduckgo\.com/,
      icon: `<svg viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg"> <defs> <clipPath id="a"> <circle cx="127.33" cy="78.97" r="52"/> </clipPath> <linearGradient id="b" gradientUnits="userSpaceOnUse" x1="1893.32" y1="-2381.98" x2="1901.89" y2="-2381.98" gradientTransform="matrix(1 0 0 -1 -1788 -2321)"> <stop offset=".01" stop-color="#6176b9"/> <stop offset=".69" stop-color="#394a9f"/> </linearGradient> <linearGradient id="c" gradientUnits="userSpaceOnUse" x1="1920.27" y1="-2379.37" x2="1928.08" y2="-2379.37" gradientTransform="matrix(1 0 0 -1 -1788 -2321)"> <stop offset=".01" stop-color="#6176b9"/> <stop offset=".69" stop-color="#394a9f"/> </linearGradient> </defs> <circle stroke="#DE5833" stroke-width="5" cx="60" cy="60" r="57.5" fill="#DE5833"/> <g transform="translate(-67.33 -18.97)"> <g clip-path="url(#a)"> <path d="M138.46 132.53c-2.51-4.88-4.91-9.37-6.4-12.34-3.96-7.93-7.94-19.11-6.13-26.32.33-1.31-3.73-48.51-6.6-50.03-3.19-1.7-10.12-3.94-13.71-4.54-2.5-.4-3.07.3-4.12.46.99.1 5.7 2.42 6.61 2.55-.91.62-3.6-.02-5.32.74-.87.4-1.52 1.88-1.5 2.58 4.9-.5 12.56-.01 17.1 2-3.61.41-9.09.87-11.45 2.11-6.84 3.6-9.86 12.03-8.06 22.13 1.79 10.08 9.72 46.85 12.25 59.13 2.52 12.27 31.51 9.7 27.32 1.53z" fill="#D5D7D8"/> <path d="M142.1 133.72c-3.01-5.97-6.08-11.68-7.86-15.22-3.97-7.94-7.93-19.11-6.13-26.32.34-1.31.34-6.67 1.43-7.38 8.41-5.5 7.81-.19 11.19-2.65 1.74-1.27 3.13-2.8 3.74-4.9 2.16-7.58-3-20.77-8.78-26.54-1.88-1.88-4.76-3.06-8.02-3.68-1.25-1.72-3.27-3.36-6.13-4.89a28.86 28.86 0 0 0-18.27-2.88c1 .1 3.26 2.14 4.17 2.27-1.38.94-5.05.82-5.03 2.9 4.92-.5 10.3.28 14.84 2.3-3.6.4-6.96 1.3-9.31 2.54-6.86 3.6-8.66 10.81-6.86 20.91 1.81 10.1 9.74 46.88 12.26 59.13 2.53 12.26 32.5 11.8 28.77 4.41z" fill="#FFF"/> </g> <circle r="3.79" cx="112.8" cy="70.69" fill="#2D4F8E"/> <circle r=".98" cx="114.49" cy="69.43" fill="#FFF"/> <circle r="3.25" cx="138.12" cy="68.44" fill="#2D4F8E"/> <circle r=".84" cx="139.57" cy="67.36" fill="#FFF"/> <path fill="url(#b)" d="M113.89 59.72s-2.86-1.3-5.63.45c-2.77 1.74-2.67 3.52-2.67 3.52s-1.47-3.28 2.45-4.89c3.93-1.6 5.85.92 5.85.92z"/> <path fill="url(#c)" d="M140.08 59.46s-2.05-1.17-3.65-1.15c-3.27.04-4.16 1.48-4.16 1.48s.55-3.44 4.73-2.75a4.2 4.2 0 0 1 3.08 2.42z"/> <path fill="#FDD20A" d="M124.4 85.3c.38-2.3 6.3-6.63 10.5-6.9 4.2-.26 5.5-.2 9-1.04 3.51-.83 12.54-3.08 15.03-4.24 2.5-1.15 13.1.57 5.63 4.74-3.23 1.81-11.94 5.13-18.17 6.99-6.22 1.86-9.99-1.78-12.06 1.28-1.64 2.43-.33 5.76 7.1 6.45 10.04.93 19.66-4.52 20.72-1.62 1.06 2.9-8.62 6.5-14.52 6.62-5.9.11-17.78-3.9-19.56-5.14-1.79-1.23-4.16-4.13-3.67-7.14z"/> <g> <path fill="#65BC46" d="M128.94 115.6s-14.1-7.53-14.33-4.48c-.24 3.06 0 15.51 1.64 16.45 1.65.94 13.4-6.1 13.4-6.1l-.7-5.88zm5.4-.48s9.64-7.29 11.76-6.82c2.11.48 2.58 15.51.7 16.23-1.88.7-12.9-3.81-12.9-3.81l.45-5.6z"/> <path fill="#43A244" d="M125.53 116.39c0 4.93-.71 7.05 1.4 7.52 2.12.47 6.11 0 7.53-.94 1.4-.94.23-7.28-.24-8.46-.47-1.18-8.7-.24-8.7 1.88z"/> <path fill="#65BC46" d="M126.43 115.3c0 4.93-.71 7.04 1.4 7.51 2.11.48 6.1 0 7.52-.94 1.41-.94.24-7.28-.23-8.46-.47-1.18-8.7-.23-8.7 1.88z"/> </g> </g> <circle cx="60" cy="60" r="53.1" fill="none" stroke="#FFF" stroke-width="3.85"/> </svg>`,
      doSearch: (keywords) => {
        window.location = `https://duckduckgo.com/?q=${ keywords }`;
      },
      getKeywords: () => {
        return document.querySelector('input[name="q"]').value;
      },
    },
  ];

  const container = document.createElement('div');
  container.id = containerId;
  container.innerHTML = `
    <style>
      #${ containerId } {
        top: 0px;
        left: -120px;
        width: 128px;
        bottom: 0px;
        display: block;
        z-index: 100000;
        position: fixed;
        background: transparent;
        transition: left 200ms cubic-bezier(0.96, 0.16, 1, 1);
      }
      #${ containerId }.active {
        left: 0px;
      }
      #${ containerId }:hover {
        left: 0px;
      }
      #${ containerId }-inner {
        width: 120px;
        height: 100%;
        display: flex;
        padding: 32px 0px;
        flex-flow: row wrap;
        background: #000000AD;
        box-sizing: border-box;
        align-content: flex-start;
        border-radius: 0px 24px 24px 0px;
        justify-content: center;
      }
      .${ containerId }-engine {
        flex: 0 0 auto;
        width: 100%;
        cursor: pointer;
        display: flex;
        flex-flow: column;
        margin-top: 16px;
        align-items: center;
      }
      .${ containerId }-engine > p {
        color: #FFFFFF;
        width: 100%;
        margin: 4px 0px 0px 0px;
        overflow: hidden;
        text-align: center;
        text-overflow: ellipsis;
      }
      .${ containerId }-engine-icon {
        flex: 0 0 auto;
        width: 48px;
        height: 48px;
        display: flex;
        overflow: hidden;
        background: #FFF;
        align-items: center;
        border-radius: 12px;
        justify-content: center;
      }
      .${ containerId }-engine-icon > img {
        width: 80%;
        height: 80%;
      }
    </style>
    <div id="${ containerId }-inner">
      ${
        engines.map(engine => {
          return `
            <div class="${ containerId }-engine" data-engine-name="${ engine.name }">
              <div class="${ containerId }-engine-icon">
                <img src="data:image/svg+xml,${ window.encodeURIComponent(engine.icon) }" />
              </div>
              <p>${ engine.name }</p>
            </div>`.trim();
        }).join('\n')
      }
    </div>
  `;
  const engineElements = Array.from(container.querySelectorAll(`.${ containerId }-engine`));
  engineElements.forEach(element => {
    const engineName = element.dataset.engineName;
    const engine = engines.find(engine => engine.name === engineName);
    element.addEventListener('click', () => {
      const current = engines.find(engine => engine.match.test(window.location.href));
      engine.doSearch(current.getKeywords());
    });
  });

  window.addEventListener('keydown', event => {
    const { keyCode, altKey, shiftKey, ctrlKey, repeat } = event;
    if(!repeat && !ctrlKey && !shiftKey && altKey && keyCode === 83) {
      if(container.classList.contains('active')) {
        container.classList.remove('active');
      } else {
        container.classList.add('active');
      }
    }
  });

  function checkElement() {
    if(!document.querySelector(`#${ containerId }`)) {
      document.body.appendChild(container);
    }
  }

  window.setInterval(() => checkElement(), 500);

})();

截图：