Medium などに貼り付けられたコードをハイライトするブックマークレット

Medium とかいい記事がたくさんなのですが。

コードが見づらいときありません?

medium-code-unhighlighted

ブックマークレットで「ハイライト」します。

Medium code snippets highlight




(() => {
  const version = '11.5.0';
  const theme = 'github-dark-dimmed';
  const prefix = `//cdnjs.cloudflare.com/ajax/libs/highlight.js/${version}`;

  const link = document.createElement('link');
  link.setAttribute('rel', 'stylesheet');
  link.setAttribute('type', 'text/css');
  link.setAttribute('href', `${prefix}/styles/${theme}.min.css`);
  document.getElementsByTagName('head')[0].appendChild(link);

  const script = document.createElement('script');
  script.setAttribute('type', 'text/javascript');
  script.setAttribute('src', `${prefix}/highlight.min.js`);
  document.getElementsByTagName('head')[0].appendChild(script);

  script.addEventListener('load', function() {
    document.querySelectorAll('pre').forEach((pre) => {
      pre.style.fontFamily = 'Courier, Menlo, Consolas, Monaco, monospace';
      pre.style.overflowX = 'scroll';
      pre.style.whiteSpace = 'pre';

      // replace medium style <br/> to LF
      pre.innerHTML = pre.innerHTML.replaceAll(/<\s*\/?br\s*[\/]?>/gi, "\n")

      if (!pre.querySelector('code')) {
        window.hljs.highlightBlock(pre);
      } else {
        window.hljs.highlightBlock(pre.querySelectorAll('code')[0]);
      }
    });
  });
})();

以下リンクをブックマークバーへドラッグしてどうぞ。

highlight-code-snippets

👉 Google「Closure Compiler」 (クロージャコンパイラ) の使い方 hatena-bookmark

Chrome 最新安定版でできればいいのだが、Javascript クリップボードへのコピー

王道の本筋からやっていきたい。


(() => {
  
  const text = `${document.title}\n👉 ${location.href}`;

  // copy to clipboard
  focus(); // avoid DOMException: Document is not focused.
  navigator.clipboard.writeText(text).then(
    () => alert(text),
    error => alert(error.message)
  );
  
})();

navigator.clipboard.writeText

これでいいんかな。

iPhone Android アプリ横断検索 をつくってみた

作ってみました javascript でブックマークレットを!

なんかパソコンで探したかったので!

iPhone Android アプリ横断検索

iPhone と Android アプリを横断で検索します。


(() => {
  const word = window.prompt("Enter the keyword.");
  if (word) {
    const q = encodeURIComponent(`${word} site:play.google.com OR site:apps.apple.com`)
    const url = `https://www.google.com/search?q=${q}`;
    window.open(url, "_blank");
  }
})();

以下、圧縮版ブックマーク登録用。


(()=>{var a=window.prompt("Enter the keyword.");a&&(a=encodeURIComponent(`${a} site:play.google.com OR site:apps.apple.com`),window.open(`https://www.google.com/search?q=${a}`,"_blank"))})();

ボタンに付けてみた。押してみてね!

気に入ったアプリを見つけたら、ブラウザの機能を使って、その端末へそのまま送ると良いです。

気に入ったアプリを見つけたら、ブラウザの機能を使って、その端末へそのまま送ると良いです。
👉 スマホのChromeで閲覧中のWebページをパソコンへ送信する方法【iPhone & Android】 

👉 GitHub Gist に置いた Javascript をブックマークレットとして実行する 
👉 Google「Closure Compiler」 (クロージャコンパイラ) の使い方