// ==UserScript==
// @name         Twitter Engagement Button
// @namespace    http://tampermonkey.net/
// @version      0.3
// @description  ツイートの下にエンゲージメント画面に飛ぶリンクを追加します｡結構自分用｡
// @author       sambaquiz
// @match        https://twitter.com/*
// @match        https://mobile.twitter.com/*
// @match        https://pbs.twimg.com/media/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=twitter.com
// @license      MIT
// @grant        none
// @downloadURL none
// ==/UserScript==

const EB = (function() {
    'use strict';

    return {
        inject: function (article) {
            let tweets = document.querySelectorAll('article[data-testid="tweet"]');

            if (article.getAttribute('data-testid') === 'tweet') {
                let wrapper = document.createElement('div');

                const username = article.querySelector('a[href*="/status/"]').href.split('/')[3];
                const statusId = article.querySelector('a[href*="/status/"]').href.split('/status/').pop().split('/').shift();

                let engagementButton = document.createElement('a');
                engagementButton.className = 'engagementButton';
                engagementButton.href = `/${username}/status/${statusId}/quotes`;
                engagementButton.target= '_blank';
                engagementButton.textContent = `エンゲージメント確認`;
                engagementButton.style.paddingLeft = '50px';

                wrapper.appendChild(engagementButton);
                article.appendChild(wrapper);
            }

            article.dataset.EBinjected = 'true';
            article.style.flexDirection = 'column';
        }
    }
})();

(function () {
  const callback = ms => ms.forEach(m => m.addedNodes.forEach(node => {
    const article = node.tagName == 'ARTICLE' && node || node.tagName == 'DIV' && (node.querySelector('article') || node.closest('article'));
    if (article && !article.dataset.EBinjected) EB.inject(article);
  }));

  const observer = new MutationObserver(callback)
  observer.observe(document.body, {childList: true, subtree: true});
})();