Twitter - 为用户添加备注(别名/标签)

为用户添加备注(别名/标签)功能,以帮助识别和搜索

当前为 2020-09-13 提交的版本,查看 最新版本

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name                Twitter - Add notes to the user
// @name:en             Twitter - Add notes(aliases/tags) to the user
// @name:zh-CN          Twitter - 为用户添加备注(别名/标签)
// @name:zh-TW          Twitter - 為用戶添加備註(別名/標籤)
// @name:ja             Twitter - ユーザーへのメモの追加(エイリアス/ラベル)
// @name:ko             Twitter - 사용자에게 메모 추가 (별칭/라벨)
// @name:fr             Twitter - ajouter des notes aux utilisateurs (alias/tag)
// @namespace           https://greasyfork.org/zh-CN/users/193133-pana
// @homepage            https://www.sailboatweb.com
// @icon                data:image/svg+xml;base64,PHN2ZyByb2xlPSJpbWciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjI0cHgiIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiBhcmlhLWxhYmVsbGVkYnk9Im5ld0ljb25UaXRsZSIgc3Ryb2tlPSJyZ2JhKDI5LDE2MSwyNDIsMS4wMCkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIgc3Ryb2tlLWxpbmVqb2luPSJtaXRlciIgZmlsbD0ibm9uZSIgY29sb3I9InJnYmEoMjksMTYxLDI0MiwxLjAwKSI+IDx0aXRsZSBpZD0ibmV3SWNvblRpdGxlIj5OZXc8L3RpdGxlPiA8cGF0aCBkPSJNMTkgMTRWMjJIMi45OTk5N1Y0SDEzIi8+IDxwYXRoIGQ9Ik0xNy40NjA4IDQuMDM5MjFDMTguMjQxOCAzLjI1ODE3IDE5LjUwODIgMy4yNTgxNiAyMC4yODkyIDQuMDM5MjFMMjAuOTYwOCA0LjcxMDc5QzIxLjc0MTggNS40OTE4NCAyMS43NDE4IDYuNzU4MTcgMjAuOTYwOCA3LjUzOTIxTDExLjU4NTggMTYuOTE0MkMxMS4yMTA3IDE3LjI4OTMgMTAuNzAyIDE3LjUgMTAuMTcxNiAxNy41TDcuNSAxNy41TDcuNSAxNC44Mjg0QzcuNSAxNC4yOTggNy43MTA3MSAxMy43ODkzIDguMDg1NzkgMTMuNDE0MkwxNy40NjA4IDQuMDM5MjFaIi8+IDxwYXRoIGQ9Ik0xNi4yNSA1LjI1TDE5Ljc1IDguNzUiLz4gPC9zdmc+
// @version             4.0.8
// @description         Add a note(alias/tag) for users to help identify and search
// @description:en      Add a note(alias/tag) for users to help identify and search
// @description:zh-CN   为用户添加备注(别名/标签)功能,以帮助识别和搜索
// @description:zh-TW   為用戶添加備註(別名/標籤)功能,以幫助識別和搜尋
// @description:ja      ユーザーが識別と検索に役立つメモ(エイリアス/タグ)機能を追加する
// @description:ko      사용자 식별 및 검색에 도움이되는 메모 (별칭/태그) 기능 추가
// @description:fr      Ajouter une fonction de notes (alias/tag) pour les utilisateurs pour aider à identifier et rechercher
// @author              pana
// @license             GNU General Public License v3.0 or later
// @compatible          chrome
// @compatible          firefox
// @include             http*://*twitter.com/*
// @require             https://cdn.jsdelivr.net/npm/[email protected]/minified/arrive.min.js
// @require             https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.min.js
// @require             https://greasyfork.org/scripts/408454-note-obj/code/Note_Obj.js?version=847163
// @noframes
// @grant               GM_info
// @grant               GM.info
// @grant               GM_getValue
// @grant               GM.getValue
// @grant               GM_setValue
// @grant               GM.setValue
// @grant               GM_deleteValue
// @grant               GM.deleteValue
// @grant               GM_listValues
// @grant               GM.listValues
// @grant               GM_openInTab
// @grant               GM.openInTab
// @grant               GM_registerMenuCommand
// @grant               GM_unregisterMenuCommand
// @grant               GM_addValueChangeListener
// @grant               GM_removeValueChangeListener
// ==/UserScript==

(async function() {
    'use strict';
    const TWITTER_ICON = {
        'NOTE_GRAY': 'url(data:image/svg+xml;base64,PHN2ZyByb2xlPSJpbWciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjI0cHgiIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiBhcmlhLWxhYmVsbGVkYnk9Im5ld0ljb25UaXRsZSIgc3Ryb2tlPSJyZ2IoMTAxLCAxMTksIDEzNCkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIgc3Ryb2tlLWxpbmVqb2luPSJtaXRlciIgZmlsbD0ibm9uZSIgY29sb3I9InJnYigxMDEsIDExOSwgMTM0KSI+IDx0aXRsZSBpZD0ibmV3SWNvblRpdGxlIj5OZXc8L3RpdGxlPiA8cGF0aCBkPSJNMTkgMTRWMjJIMi45OTk5N1Y0SDEzIi8+IDxwYXRoIGQ9Ik0xNy40NjA4IDQuMDM5MjFDMTguMjQxOCAzLjI1ODE3IDE5LjUwODIgMy4yNTgxNiAyMC4yODkyIDQuMDM5MjFMMjAuOTYwOCA0LjcxMDc5QzIxLjc0MTggNS40OTE4NCAyMS43NDE4IDYuNzU4MTcgMjAuOTYwOCA3LjUzOTIxTDExLjU4NTggMTYuOTE0MkMxMS4yMTA3IDE3LjI4OTMgMTAuNzAyIDE3LjUgMTAuMTcxNiAxNy41TDcuNSAxNy41TDcuNSAxNC44Mjg0QzcuNSAxNC4yOTggNy43MTA3MSAxMy43ODkzIDguMDg1NzkgMTMuNDE0MkwxNy40NjA4IDQuMDM5MjFaIi8+IDxwYXRoIGQ9Ik0xNi4yNSA1LjI1TDE5Ljc1IDguNzUiLz4gPC9zdmc+)',
        'NOTE_BLUE': 'url(data:image/svg+xml;base64,PHN2ZyByb2xlPSJpbWciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjI0cHgiIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiBhcmlhLWxhYmVsbGVkYnk9Im5ld0ljb25UaXRsZSIgc3Ryb2tlPSJyZ2JhKDI5LDE2MSwyNDIsMS4wMCkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIgc3Ryb2tlLWxpbmVqb2luPSJtaXRlciIgZmlsbD0ibm9uZSIgY29sb3I9InJnYmEoMjksMTYxLDI0MiwxLjAwKSI+IDx0aXRsZSBpZD0ibmV3SWNvblRpdGxlIj5OZXc8L3RpdGxlPiA8cGF0aCBkPSJNMTkgMTRWMjJIMi45OTk5N1Y0SDEzIi8+IDxwYXRoIGQ9Ik0xNy40NjA4IDQuMDM5MjFDMTguMjQxOCAzLjI1ODE3IDE5LjUwODIgMy4yNTgxNiAyMC4yODkyIDQuMDM5MjFMMjAuOTYwOCA0LjcxMDc5QzIxLjc0MTggNS40OTE4NCAyMS43NDE4IDYuNzU4MTcgMjAuOTYwOCA3LjUzOTIxTDExLjU4NTggMTYuOTE0MkMxMS4yMTA3IDE3LjI4OTMgMTAuNzAyIDE3LjUgMTAuMTcxNiAxNy41TDcuNSAxNy41TDcuNSAxNC44Mjg0QzcuNSAxNC4yOTggNy43MTA3MSAxMy43ODkzIDguMDg1NzkgMTMuNDE0MkwxNy40NjA4IDQuMDM5MjFaIi8+IDxwYXRoIGQ9Ik0xNi4yNSA1LjI1TDE5Ljc1IDguNzUiLz4gPC9zdmc+)',
        'SEARCH_BLUE': 'url(data:image/svg+xml;base64,PHN2ZyByb2xlPSJpbWciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjI0cHgiIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiBhcmlhLWxhYmVsbGVkYnk9InNlYXJjaEljb25UaXRsZSIgc3Ryb2tlPSJyZ2JhKDI5LDE2MSwyNDIsMS4wMCkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIgc3Ryb2tlLWxpbmVqb2luPSJtaXRlciIgZmlsbD0ibm9uZSIgY29sb3I9InJnYmEoMjksMTYxLDI0MiwxLjAwKSI+IDx0aXRsZSBpZD0ic2VhcmNoSWNvblRpdGxlIj5TZWFyY2g8L3RpdGxlPiA8cGF0aCBkPSJNMTQuNDEyMTEyMiwxNC40MTIxMTIyIEwyMCwyMCIvPiA8Y2lyY2xlIGN4PSIxMCIgY3k9IjEwIiByPSI2Ii8+IDwvc3ZnPg==)'
    };
    const TWITTER_STYLE = `
        .note-obj-twitter-blue-tag {
            background-color: #3c81df;
            color: #fff;
            display: inline-flex;
            align-items: center;
            padding: 2px 10px;
            white-space: nowrap;
            line-height: 100%;
            border-radius: 50px;
        }
        .note-obj-twitter-note-btn {
            background-image: ${TWITTER_ICON.NOTE_GRAY};
            background-repeat: no-repeat;
            background-position: center;
            background-color: rgba(0, 0, 0, 0);
            border-bottom-left-radius: 9999px;
            border-bottom-right-radius: 9999px;
            border-top-left-radius: 9999px;
            border-top-right-radius: 9999px;
            transition-property: background-color, box-shadow;
            transition-duration: 0.2s;
        }
        .note-obj-twitter-note-btn:hover {
            background-image: ${TWITTER_ICON.NOTE_BLUE};
            background-color: rgba(29, 161, 242, .1);
        }
        .note-obj-twitter-panel-btn {
            height: 32px;
            width: 32px;
            margin: 5px 0px 0px 0px;
            background-size: 28px auto;
            cursor: pointer !important;
            border-radius: 0px;
        }
        .note-obj-twitter-panel-btn:hover::after {
            content: "";
            display: flex;
            position: relative;
            background-color: rgba(29, 161, 242, .1);
            width: 48px;
            height: 48px;
            top: -8px;
            left: -8px;
            border-radius: 99px;
        }
        .note-obj-twitter-base-tool-bar-btn-mobile {
            height: 18px;
            width: 18px;
            margin: 0px 20px 0px 0px;
            background-size: 18px auto;
            border-radius: 0px;
        }
        .note-obj-twitter-comment-tool-bar-btn-mobile {
            height: 24px;
            width: 24px;
            background-size: 24px auto;
            border-radius: 0px;
            margin: 10px 0px 0px 0px;
        }
        .note-obj-twitter-before-follow-note-btn {
            height: 38px;
            width: 38px;
            background-image: ${TWITTER_ICON.NOTE_BLUE};
            background-repeat: no-repeat;
            background-size: 19px auto;
            background-position: center;
            margin-bottom: 10px;
            margin-right: 10px;
            cursor: pointer;
            border: 1px solid rgba(29, 161, 242, 1);
            border-bottom-left-radius: 9999px;
            border-bottom-right-radius: 9999px;
            border-top-left-radius: 9999px;
            border-top-right-radius: 9999px;
            background-color: rgba(0, 0, 0, 0);
            transition-property: background-color, box-shadow;
            transition-duration: 0.2s;
        }
        .note-obj-twitter-before-follow-note-btn:hover {
            background-color: rgba(29, 161, 242, .1);
        }
        .note-obj-twitter-before-follow-note-btn-mobile {
            margin-bottom: 8px !important;
        }
        .note-obj-twitter-search-btn-mobile {
            background-image: ${TWITTER_ICON.SEARCH_BLUE};
            background-size: 28px auto;
            background-position: center;
            background-repeat: no-repeat;
            width: 28px;
            height: 28px;
            margin: 10px 20px 0px 0px;
        }
        .note-obj-twitter-base-tool-bar-btn {
            height: 18px;
            width: 18px;
            margin: 0px -40px 0px 0px;
            background-size: 20px auto;
            border-radius: 0px;
        }
        .note-obj-twitter-base-tool-bar-btn:hover::after {
            content: "";
            position: absolute;
            background-color: rgba(29, 161, 242, .1);
            width: 34px;
            height: 34px;
            top: -8px;
            left: -8px;
            border-radius: 99px;
        }
        .note-obj-twitter-comment-tool-bar-btn {
            height: 24px;
            width: 24px;
            margin: 12px 0px 0px 0px;
            background-size: 24px auto;
            border-radius: 0px;
            cursor: pointer;
        }
        .note-obj-twitter-comment-tool-bar-btn:hover::after {
            content: "";
            position: absolute;
            background-color: rgba(29, 161, 242, .1);
            width: 38px;
            height: 38px;
            top: -8px;
            left: -8px;
            border-radius: 99px;
        }
    `;
    var selector = {
        'body': 'body',
        'root': '#react-root div .r-13awgt0.r-12vffkv',
        'homepage': {
            'article': 'article',
            'tool_bar': '.css-1dbjc4n.r-18u37iz.r-1wtj0ep.r-1mdbhws',
            'show_name': '.css-901oao.css-bfa6kz.r-1qd0xha.r-vw2c0b.r-ad9z0x.r-bcqeeo.r-3s2u2q.r-qvutc0 > span',
            'id': '.css-901oao.css-bfa6kz.r-18u37iz.r-1qd0xha.r-16dba41.r-ad9z0x.r-bcqeeo.r-qvutc0 > span',
            'reprint_a': '.css-1dbjc4n.r-1habvwh.r-16y2uox a',
            'reprint_name': ':scope > span:first-of-type > span',
            'at': 'a.css-4rbku5.css-18t94o4.css-901oao.css-16my406.r-1loqt21.r-1qd0xha.r-ad9z0x.r-bcqeeo.r-qvutc0',
            'user_frame': '.css-18t94o4.css-1dbjc4n.r-1ny4l3l.r-1j3t67a.r-1w50u8q.r-o7ynqc.r-6416eg',
            'blockquote': 'div[role="blockquote"]'
        },
        'userpage': {
            'main_user_id': '.css-1dbjc4n.r-15d164r.r-1g94qm0 .css-1dbjc4n.r-18u37iz.r-1wbh5a2 > div > span',
            'main': '.css-1dbjc4n.r-ku1wi2.r-1j3t67a.r-m611by',
            'id': '.css-1dbjc4n.r-18u37iz.r-1wbh5a2 > div > span',
            'follow': '.css-1dbjc4n.r-obd0qt.r-18u37iz.r-1w6e6rj.r-1h0z5md.r-dnmrzs',
            'show_name': '.css-901oao.r-1qd0xha.r-1b6yd1w.r-1vr29t4.r-ad9z0x.r-bcqeeo.r-qvutc0 > span'
        },
        'comment': {
            'tool_bar': '.css-1dbjc4n.r-1oszu61.r-1efd50x.r-5kkj8d.r-18u37iz.r-a2tzq0'
        },
        'mobile': {
            'bootom_bar': ''
        },
        'hover': {
            'panel': 'div.css-1dbjc4n.r-1oqcu8e',
            'follow_btn': '.css-1dbjc4n.r-bcqeeo',
            'id': '.css-1dbjc4n.r-18u37iz.r-1wbh5a2',
            'show_name': '.css-901oao.css-bfa6kz.r-1qd0xha.r-a023e6.r-vw2c0b.r-ad9z0x.r-bcqeeo.r-3s2u2q.r-qvutc0 > span'
        }
    };
    var mobile_selector = {
        'body': 'body',
        'root': '#react-root div .r-13awgt0.r-12vffkv',
        'homepage': {
            'article': 'article',
            'tool_bar': '.css-1dbjc4n.r-18u37iz.r-1wtj0ep.r-1mdbhws',
            'show_name': '.css-901oao.css-bfa6kz.r-1qd0xha.r-vw2c0b.r-ad9z0x.r-bcqeeo.r-3s2u2q.r-qvutc0 > span',
            'id': '.css-901oao.css-bfa6kz.r-18u37iz.r-1qd0xha.r-16dba41.r-ad9z0x.r-bcqeeo.r-qvutc0 > span',
            'reprint_a': '.css-1dbjc4n.r-1habvwh.r-1iusvr4.r-16y2uox a',
            'reprint_name': '.css-1dbjc4n.r-1habvwh.r-1iusvr4.r-16y2uox a > span > span',
            'at': 'a.css-4rbku5.css-18t94o4.css-901oao.css-16my406.r-1loqt21.r-1qd0xha.r-ad9z0x.r-bcqeeo.r-qvutc0',
            'user_frame': '.css-18t94o4.css-1dbjc4n.r-rull8r.r-qklmqi.r-1ny4l3l.r-779j7e.r-1xtiow5.r-o7ynqc.r-6416eg',
            'blockquote': 'div[role="blockquote"]'
        },
        'userpage': {
            'main_user_id': '.css-1dbjc4n.r-hxarbt.r-1g94qm0 .css-1dbjc4n.r-18u37iz.r-1wbh5a2 > div > span',
            'main': '.css-1dbjc4n.r-1cad53l.r-779j7e.r-1b9bua6',
            'id': '.css-1dbjc4n.r-18u37iz.r-1wbh5a2 > div > span',
            'follow': '.css-1dbjc4n.r-obd0qt.r-18u37iz.r-1w6e6rj.r-1h0z5md.r-dnmrzs',
            'show_name': '.css-901oao.r-1qd0xha.r-1i10wst.r-1vr29t4.r-ad9z0x.r-bcqeeo.r-qvutc0 > span'
        },
        'comment': {
            'tool_bar': '.css-1dbjc4n.r-1oszu61.r-1efd50x.r-5kkj8d.r-18u37iz.r-a2tzq0'
        },
        'mobile': {
            'bootom_bar': '.css-1dbjc4n.r-18u37iz.r-drjvcx.r-ripixn.r-13qz1uu'
        },
        'hover': {
            'panel': 'div.css-1dbjc4n.r-1oqcu8e',
            'follow_btn': '.css-1dbjc4n.r-bcqeeo',
            'id': '.css-1dbjc4n.r-18u37iz.r-1wbh5a2',
            'show_name': '.css-901oao.css-bfa6kz.r-1qd0xha.r-a023e6.r-vw2c0b.r-ad9z0x.r-bcqeeo.r-3s2u2q.r-qvutc0 > span'
        }
    };
    var note_obj = new Note_Obj('myTwitterNote');
    await note_obj.init({
        'style': selector.homepage.show_name + ' { white-space: normal; }\n' + TWITTER_STYLE,
        'changeEvent': change_Event,
        'settings': {
            'showToolbarButton': {
                'type': 'checkbox',
                'lang': {
                    'en': 'Display the "Add Note" button in the toolbar below each tweet (if there is no such button in the user\'s hover information panel, this option can be turned on)',
                    'zh_cn': '在每条推特下方的工具栏里显示"添加备注"按钮 (如果在用户的悬停信息面板里没有此按钮时,可以打开此选项)',
                    'zh_tw': '在每條推特下方的工具欄裡顯示"添加備註"按鈕 (如果在用戶的懸停資訊面板裡沒有此按鈕時,可以打開此選項)',
                    'ja': '各Twitterの下のツールバーに“備考追加”ボタンが表示されます(ユーザのホバリング情報パネルにこのボタンがない場合は、このオプションを開くことができます)',
                    'ko': '각 트위터 아래의 도구 모음에 "메모 추가" 단추가 표시됩니다(사용자의 롤오버 정보 패널에 이 단추가 없는 경우 이 옵션을 설정할 수 있음)',
                    'fr': 'Afficher le bouton "Ajouter une note" dans la barre d\'outils sous chaque tweet (S\'il n\'y a pas de bouton de ce type dans le panneau d\'informations de survol de l\'utilisateur, vous pouvez activer cette option)'
                },
                'defalut': false,
                'event': insert_Toolbar_Button_Event
            }
        },
        'script': {
            'author': {
                'name': 'pana',
                'homepage': 'https://www.sailboatweb.com/'
            },
            'address': 'https://greasyfork.org/scripts/404587',
            'updated': '2020-9-13',
            'library': [
                {
                    'name': 'arrive.js',
                    'version': '2.4.1',
                    'url': 'https://github.com/uzairfarooq/arrive'
                }
            ]
        }
    });
    function insert_Toolbar_Button_Event(status) {
        if (! Note_Obj.fn.isMobilePage()) {
            document.querySelectorAll(selector.homepage.article).forEach(ele => {
                if (ele.querySelector(selector.homepage.id)) {
                    let ele_id = ele.querySelector(selector.homepage.id).textContent.replace(/^@/, '');
                    let ele_name = ele.querySelector(selector.homepage.show_name).textContent;
                    let tool_bar = ele.querySelector(selector.homepage.tool_bar);
                    let comment_tool_bar = ele.querySelector(selector.comment.tool_bar);
                    if (status) {
                        tool_bar && ! tool_bar.querySelector('.note-obj-add-note-btn') && tool_bar.appendChild(note_obj.createNoteBtn(ele_id, ele_name, ['note-obj-twitter-note-btn', 'note-obj-twitter-base-tool-bar-btn', 'css-1dbjc4n']));
                        comment_tool_bar && ! comment_tool_bar.querySelector('.note-obj-add-note-btn') && comment_tool_bar.appendChild(note_obj.createNoteBtn(ele_id, ele_name, ['note-obj-twitter-note-btn', 'note-obj-twitter-comment-tool-bar-btn', 'css-1dbjc4n']));
                    } else {
                        tool_bar && tool_bar.querySelector('.note-obj-add-note-btn') && tool_bar.querySelector('.note-obj-add-note-btn').remove();
                        comment_tool_bar && comment_tool_bar.querySelector('.note-obj-add-note-btn') && comment_tool_bar.querySelector('.note-obj-add-note-btn').remove();
                    }
                }
            });
        }
    }
    function change_Event(note_obj, user_id = null) {
        for (let ele of document.querySelectorAll(selector.homepage.article)) {
            if (ele.querySelector(selector.homepage.id)) {
                let ele_id = ele.querySelector(selector.homepage.id).textContent.replace(/^@/, '');
                (! user_id || user_id == ele_id) && note_obj.handler(ele_id, ele, selector.homepage.show_name, {
                    'add': 'span',
                    'classname': 'note-obj-twitter-blue-tag'
                });
            }
            let reprint_a = ele.querySelector(selector.homepage.reprint_a);
            if (reprint_a) {
                let reprint_id = Note_Obj.fn.getUserIdFromLink(reprint_a.href);
                (! user_id || user_id == reprint_id) && note_obj.handler(reprint_id, reprint_a, selector.homepage.reprint_name, {
                    'add': 'span',
                    'classname': 'note-obj-twitter-blue-tag',
                    'symbol': {
                        'offsetWidth': 30
                    }
                });
            }
            let blockquote_user = ele.querySelector(selector.homepage.blockquote);
            if (blockquote_user) {
                let blockquote_user_id = blockquote_user.querySelector(selector.homepage.id).textContent.replace(/^@/, '');
                if (blockquote_user_id == user_id) {
                    note_obj.handler(user_id, blockquote_user, selector.homepage.show_name);
                }
                (! user_id || user_id == blockquote_user_id) && note_obj.handler(blockquote_user_id, blockquote_user, selector.homepage.show_name, {
                    'add': 'span',
                    'classname': 'note-obj-twitter-blue-tag'
                });
            }
            for (let at_user of ele.querySelectorAll(selector.homepage.at)) {
                let at_user_id = Note_Obj.fn.getUserIdFromLink(at_user.href, value => /^[^/]+$/i.test(value));
                (! user_id || user_id == at_user_id) && note_obj.judgeUsers(at_user_id) && note_obj.handler(at_user_id, at_user, null, {
                    'symbol': {
                        'prefix': '@'
                    }
                });
            }
        }
        for (let ele of document.querySelectorAll(selector.userpage.main)) {
            let user = ele.querySelector(selector.userpage.id);
            if (user) {
                let ele_id = user.textContent.replace(/^@/, '');
                (! user_id || user_id == ele_id) && note_obj.handler(ele_id, ele, selector.userpage.show_name, {
                    'add': 'span',
                    'classname': 'note-obj-twitter-blue-tag'
                });
            }
        }
        for (let ele of document.querySelectorAll(selector.homepage.user_frame)) {
            let user = ele.querySelector(selector.userpage.id);
            if (user) {
                let ele_id = user.textContent.replace(/^@/, '');
                (! user_id || user_id == ele_id) && note_obj.handler(ele_id, ele, selector.homepage.show_name, {
                    'add': 'span',
                    'class': 'note-obj-twitter-blue-tag'
                });
            }
        }
    }
    function init() {
        let arrive_option = {
            'fireOnAttributesModification': true,
            'existing': true
        };
        if (Note_Obj.fn.isMobilePage()) {
            selector = mobile_selector;
            document.querySelector(selector.root).arrive(selector.mobile.bootom_bar, arrive_option, function() {
                this.appendChild(note_obj.createSearchButton('note-obj-twitter-search-btn-mobile'));
            });
        }
        document.querySelector(selector.root).arrive(selector.homepage.article, arrive_option, ele => {
            if (ele.querySelector(selector.homepage.id)) {
                let ele_id = ele.querySelector(selector.homepage.id).textContent.replace(/^@/, '');
                let ele_name = ele.querySelector(selector.homepage.show_name).textContent;
                if (Note_Obj.fn.isMobilePage()) {
                    ele.querySelector(selector.homepage.tool_bar) && ele.querySelector(selector.homepage.tool_bar).appendChild(note_obj.createNoteBtn(ele_id, ele_name, ['note-obj-twitter-note-btn', 'note-obj-twitter-base-tool-bar-btn-mobile', 'css-1dbjc4n']));
                } else {
                    note_obj.getConfig().other.showToolbarButton && ele.querySelector(selector.homepage.tool_bar) && ele.querySelector(selector.homepage.tool_bar).appendChild(note_obj.createNoteBtn(ele_id, ele_name, ['note-obj-twitter-note-btn', 'note-obj-twitter-base-tool-bar-btn', 'css-1dbjc4n']));
                }
                if (Note_Obj.fn.isMobilePage()) {
                    ele.querySelector(selector.comment.tool_bar) && ele.querySelector(selector.comment.tool_bar).appendChild(note_obj.createNoteBtn(ele_id, ele_name, ['note-obj-twitter-note-btn', 'note-obj-twitter-comment-tool-bar-btn-mobile', 'css-1dbjc4n']));
                } else {
                    note_obj.getConfig().other.showToolbarButton && ele.querySelector(selector.comment.tool_bar) && ele.querySelector(selector.comment.tool_bar).appendChild(note_obj.createNoteBtn(ele_id, ele_name, ['note-obj-twitter-note-btn', 'note-obj-twitter-comment-tool-bar-btn', 'css-1dbjc4n']));
                }
                note_obj.judgeUsers(ele_id) && note_obj.handler(ele_id, ele, selector.homepage.show_name, {
                    'add': 'span',
                    'classname': 'note-obj-twitter-blue-tag'
                }, ele_name);
            }
            let reprint_a = ele.querySelector(selector.homepage.reprint_a);
            if (reprint_a) {
                let reprint_id = Note_Obj.fn.getUserIdFromLink(reprint_a.href);
                note_obj.judgeUsers(reprint_id) && note_obj.handler(reprint_id, reprint_a, selector.homepage.reprint_name, {
                    'add': 'span',
                    'classname': 'note-obj-twitter-blue-tag',
                    'symbol': {
                        'offsetWidth': 30
                    }
                });
            }
            let blockquote_user = ele.querySelector(selector.homepage.blockquote);
            if (blockquote_user) {
                let blockquote_user_id = blockquote_user.querySelector(selector.homepage.id).textContent.replace(/^@/, '');
                note_obj.judgeUsers(blockquote_user_id) && note_obj.handler(blockquote_user_id, blockquote_user, selector.homepage.show_name, {
                    'add': 'span',
                    'classname': 'note-obj-twitter-blue-tag'
                });
            }
            for (let at_user of ele.querySelectorAll(selector.homepage.at)) {
                let at_user_id = Note_Obj.fn.getUserIdFromLink(at_user.href, value => /^[^/]+$/i.test(value));
                note_obj.judgeUsers(at_user_id) && note_obj.handler(at_user_id, at_user, null, {
                    'symbol': {
                        'prefix': '@'
                    }
                });
            }
        });
        document.querySelector(selector.root).arrive(selector.userpage.main, arrive_option, ele => {
            let ele_id = ele.querySelector(selector.userpage.id).textContent.replace(/^@/, '');
            let ele_name = ele.querySelector(selector.userpage.show_name).textContent;
            var follow_note_btn;
            if (ele.querySelector(selector.userpage.follow)) {
                if (Note_Obj.fn.isMobilePage()) {
                    follow_note_btn = note_obj.createNoteBtn(ele_id, ele_name, ['note-obj-twitter-before-follow-note-btn', 'note-obj-twitter-before-follow-note-btn-mobile', 'css-901oao']);
                } else {
                    follow_note_btn = note_obj.createNoteBtn(ele_id, ele_name, ['note-obj-twitter-before-follow-note-btn', 'css-901oao']);
                }
                ele.querySelector(selector.userpage.follow).insertAdjacentElement('afterbegin', follow_note_btn);
            }
            note_obj.judgeUsers(ele_id) && note_obj.handler(ele_id, ele, selector.userpage.show_name, {
                'add': 'span',
                'classname': 'note-obj-twitter-blue-tag'
            }, ele_name);
            let user_id_change = new MutationObserver(() => {
                let new_user_id = ele.querySelector(selector.userpage.id).textContent.replace(/^@/, '');
                note_obj.handler('', ele, selector.userpage.show_name, {
                    'add': 'span',
                    'classname': 'note-obj-twitter-blue-tag'
                });
                let new_user_name = ele.querySelector(selector.userpage.show_name).textContent;
                if (follow_note_btn) {
                    follow_note_btn.remove();
                    if (Note_Obj.fn.isMobilePage()) {
                        follow_note_btn = note_obj.createNoteBtn(new_user_id, new_user_name, ['note-obj-twitter-before-follow-note-btn', 'note-obj-twitter-before-follow-note-btn-mobile', 'css-901oao']);
                    } else {
                        follow_note_btn = note_obj.createNoteBtn(new_user_id, new_user_name, ['note-obj-twitter-before-follow-note-btn', 'css-901oao']);
                    }
                    ele.querySelector(selector.userpage.follow).insertAdjacentElement('afterbegin', follow_note_btn);
                }
                note_obj.judgeUsers(new_user_id) && note_obj.handler(new_user_id, ele, selector.userpage.show_name, {
                    'add': 'span',
                    'classname': 'note-obj-twitter-blue-tag'
                }, new_user_name);
            });
            user_id_change.observe(ele.querySelector(selector.userpage.main_user_id), {
                'subtree': true,
                'characterData': true
            });
        });
        document.querySelector(selector.root).arrive(selector.homepage.user_frame, arrive_option, ele => {
            let ele_id = ele.querySelector(selector.userpage.id).textContent.replace(/^@/, '');
            note_obj.judgeUsers(ele_id) && note_obj.handler(ele_id, ele, selector.homepage.show_name, {
                'add': 'span',
                'class': 'note-obj-twitter-blue-tag'
            });
        });
        document.querySelector(selector.root).arrive(selector.hover.panel, arrive_option, ele => {
            let user = ele.querySelector(selector.hover.id);
            if (user) {
                let ele_id = user.textContent.replace(/^@/, '');
                let user_show_name = ele.querySelector(selector.hover.show_name).textContent;
                ele.querySelector(selector.hover.follow_btn) && ele.querySelector(selector.hover.follow_btn).insertAdjacentElement('beforebegin', note_obj.createNoteBtn(ele_id, user_show_name, ['note-obj-twitter-note-btn', 'note-obj-twitter-panel-btn']));
                note_obj.judgeUsers(ele_id) && note_obj.handler(ele_id, ele, selector.hover.show_name, {
                    'add': 'span',
                    'class': 'note-obj-twitter-blue-tag'
                }, user_show_name);
            }
        });
    }
    init();
})();