タグ固定するやつ

README.md

タグ固定するやつ

MastodonのWebUIでハッシュタグ付き投稿をする際、
何回も打ち直すことなく固定して投稿できるようにするものです。

機能

• タグボタンを押すことで固定文を挿入するかしないか切り替えられます
• 文章を固定できるので様々な使い方ができます
• 最後に使用した固定文は保存されます

動作環境

ユーザースクリプトですので、それを利用できる拡張機能を入れてください

• Tampermonkey (Chrome / Firefox)

Androidで使う場合

Firefoxの拡張機能、USIを使用してください(Tampermonkeyでは動きません)
Yandexの場合はChrome拡張 Tampermonkeyを使用します

インストール

Tampermonkeyを導入済みの場合、こちらからユーザースクリプトをインストールできます

インストール後、設定の「include/exclude」の「ユーザーによる match」へ自身の利用しているMastodonサーバーのURLを入れてください

変更履歴

2.0.0

• Mastodon v4.3.0に対応（テンプレートリストは削除）

1.4.5

• Mastodon v4.0.2に対応

1.4.4

• Mastodon v3.0.1に対応

タグ固定するやつ.user.js

// ==UserScript==
// @name         タグ固定するやつ
// @namespace    https://md.korako.me/@karasu_sue
// @version      2.0.0
// @description  タグ固定するやつ
// @author       Sue Karasugawa https://md.korako.me/@karasu_sue
// @match        https://md.korako.me/*
// @updateURL    https://gist.githubusercontent.com/karasugawasu/d84015f1bc3709283cef5397b105a20b/raw/%25E3%2582%25BF%25E3%2582%25B0%25E5%259B%25BA%25E5%25AE%259A%25E3%2581%2599%25E3%2582%258B%25E3%2582%2584%25E3%2581%25A4.user.js
// @downloadURL  https://gist.githubusercontent.com/karasugawasu/d84015f1bc3709283cef5397b105a20b/raw/%25E3%2582%25BF%25E3%2582%25B0%25E5%259B%25BA%25E5%25AE%259A%25E3%2581%2599%25E3%2582%258B%25E3%2582%258C%25E3%2581%25A4.user.js
// @supportURL   https://gist.github.com/karasugawasu/d84015f1bc3709283cef5397b105a20b
// ==/UserScript==

(function() {
    'use strict';

    function Init() {
        const dropdowns = document.querySelector('.compose-form__dropdowns');

        if (dropdowns) {
            const newButtonDiv = document.createElement('div');
            newButtonDiv.innerHTML = `
                <button type="button" title="ハッシュタグ固定するやつ" aria-expanded="false" class="dropdown-button">
                    <svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" class="icon icon-hashtag" aria-hidden="true">
                        <path d="m240-160 40-160H120l20-80h160l40-160H180l20-80h160l40-160h80l-40 160h160l40-160h80l-40 160h160l-20 80H660l-40 160h160l-20 80H600l-40 160h-80l40-160H360l-40 160h-80Zm140-240h160l40-160H420l-40 160Z"></path>
                    </svg>
                    <span class="dropdown-button__label">固定タグ</span>
                </button>
            `;

            const newButton = newButtonDiv.querySelector('button');
            newButton.addEventListener('click', toggleKoteitagInput);
            dropdowns.appendChild(newButtonDiv);

            const koteitagDiv = document.createElement('div');
            koteitagDiv.classList.add('koteitag-input');
            koteitagDiv.innerHTML = `
                <input type="text" placeholder="固定したい文字列を入力" aria-label="固定したい文字列を入力" class="spoiler-input__input koteitag-input__input" value="">
            `;

            const form = document.querySelector('.compose-form__scrollable');
            form.insertAdjacentElement('afterend', koteitagDiv);
            koteitagDiv.style.display = 'none';

            const savedKoteitag = localStorage.getItem('koteitagValue');
            if (savedKoteitag) {
                koteitagDiv.querySelector('.koteitag-input__input').value = savedKoteitag;
            }

            document.querySelectorAll('.compose-form__submit button').forEach(button => {
                button.addEventListener('click', setkoteitag);
            });
            document.querySelector('.autosuggest-textarea__textarea').addEventListener('keydown', formSubmitKeydown);
        }
    }

    function toggleKoteitagInput() {
        const koteitagDiv = document.querySelector('.koteitag-input');
        if (koteitagDiv) {
            koteitagDiv.style.display = koteitagDiv.style.display === 'none' || koteitagDiv.style.display === '' ? 'block' : 'none';
        }
    }

    function setkoteitag() {
        const koteitagDiv = document.querySelector('.koteitag-input');
        if (koteitagDiv && koteitagDiv.style.display === 'block') {
            const drawer = document.querySelector('.drawer');
            const textarea = drawer.querySelector('.autosuggest-textarea__textarea');
            const statusValue = String(textarea.value);
            const koteitagValue = String(koteitagDiv.querySelector('.koteitag-input__input').value);

            localStorage.setItem('koteitagValue', koteitagValue);

            if (koteitagValue !== "") {
                setTextAreaText(statusValue + "\n" + koteitagValue + " ");
            }
        }
    }

    function formSubmitKeydown() {
		if(event.ctrlKey){
			if(event.keyCode === 13){
                setkoteitag();
				return false;
			}
		}
	}

    function setTextAreaText(value) {
        const drawer = document.querySelector('.drawer');
        const textarea = drawer.querySelector('.autosuggest-textarea__textarea');
        Object.getOwnPropertyDescriptor(Object.getPrototypeOf(textarea), 'value').set.call(textarea, value);
        textarea.dispatchEvent(new Event('input', { bubbles: true }));
    }

    window.addEventListener("load", function() {
        if (window.innerWidth > 630 || window.location.pathname === '/web/statuses/new') {
            Init();
        }

        document.body.addEventListener('click', function() {
            setTimeout(function() {
                if (document.querySelector('.compose-form__dropdowns') && !document.querySelector('.koteitag-input')) {
                    Init();
                }
            }, 100);
        });
    });
})();