add-column-icon-in-tweetdeck

  • /*
     * @title add-column-icon-in-tweetdeck
     * @description TweetDeck でカラムに所有者のアイコンを表示する
     * @include https://tweetdeck.twitter.com/*
     * @license MIT License
     */
    const urlSet = {};
    /* アイコンのURLを取得する */
    Array.from(document.querySelectorAll('.js-account-list .js-account-item')).forEach(item => {
      const img = item.querySelector('img');
      urlSet[item.title] = img.src;
    });
    /* アイコンのクラス名 */
    const iconClassName = 'column-header-title-icon';
    /* アイコンを置く */
    Array.from(document.querySelectorAll('.column-header-title')).forEach(title => {
      /* 前のアイコンは消しておく */
      Array.from(title.getElementsByClassName(iconClassName)).forEach(old => {
        title.removeChild(old);
      });
      const name = title.querySelector('.attribution').innerText;
      const iconImg = document.createElement('img');
      iconImg.className = iconClassName;
      iconImg.src = urlSet[name];
      Object.entries({
        width: '25px',
        height: '25px',
        marginRight: '7px',
        borderRadius: '3px',
      }).forEach(([key, value]) => {
        iconImg.style[key] = value;
      });
      title.insertBefore(iconImg, title.children[0]);
    });
    
  • Permalink
    このページへの個別リンクです。
    RAW
    書かれたコードへの直接のリンクです。
    Packed
    文字列が圧縮された書かれたコードへのリンクです。
    Userscript
    Greasemonkey 等で利用する場合の .user.js へのリンクです。
    Loader
    @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
    Metadata
    コード中にコメントで @xxx と書かれたメタデータの JSON です。

History

  1. 2019/01/20 15:02:29 - 2019-01-20