Skip to content

Instantly share code, notes, and snippets.

@karasugawasu karasugawasu/README.md
Last active Jun 25, 2019

Embed
What would you like to do?
タグ固定するやつ

タグ固定するやつ

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

機能

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

動作環境

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

Androidで使う場合

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

インストール

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

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

// ==UserScript==
// @name タグ固定するやつ
// @namespace https://mstdn.precure.fun/@karasu_sue
// @version 1.3β
// @description タグ固定するやつ
// @author Sue Karasugawa https://mstdn.precure.fun/@karasu_sue
// @match https://mstdn.precure.fun/*
// @match https://precure.ml/*
// @grant GM_addStyle
// ==/UserScript==
(function() {
'use strict';
var koteitag_list_index = 0;
var template_list;
window.addEventListener("load", function() {
if (window.innerWidth > 630) {
Init();
}else{
if(window.location.pathname == '/web/statuses/new'){
Init();
}
document.querySelector('body').addEventListener('click', function(){
setTimeout(function() {
if(document.querySelector('div.columns-area .drawer') != null){
if(document.querySelector('.koteitag-input') == null){
Init();
}
}
},100);
});
}
});
function Init(){
if(document.querySelector('div.compose-form')){
addKoteitagInput();
addKoteitagButton();
setEvents();
}
var css = `
.koteitag-input {
position: relative;
height: 0;
transform-origin: bottom;
opacity: 0.0;
transition: height 0.4s ease, opacity 0.4s ease;
}
.koteitag-input--visible {
height: 47px;
opacity: 1.0;
}
.koteitag-input__input {
display: block !important;
box-sizing: border-box !important;
width: 100%;
padding: 10px;
resize: vertical;
outline: 0;
border-radius: 0 0 4px 4px;
}
`;
GM_addStyle(css)
if(localStorage.getItem('karasu_koteitag') != "" && document.querySelector('.koteitag-input__input') != null ){
document.querySelector('.koteitag-input__input').value = localStorage.getItem('karasu_koteitag');
}
}
function addKoteitagInput(){
var koteitag = document.createElement('div');
koteitag.classList.add('koteitag-input');
koteitag.appendChild(document.createElement('label'));
var koteistyle = document.createElement('span');
koteistyle.setAttribute('style', 'display: none;');
koteitag.querySelector('label').appendChild(koteistyle);
var koteiinput = document.createElement('input');
koteiinput.classList.add('setting-text');
koteiinput.classList.add('koteitag-input__input');
koteiinput.setAttribute('placeholder', 'ここに固定したいハッシュタグを記載');
koteiinput.setAttribute('tabindex', '-1');
koteiinput.setAttribute('type', 'text');
koteiinput.setAttribute('id', 'koteitag-input');
koteiinput.addEventListener('change', savekoteitag);
koteiinput.addEventListener('keyup', selectTags);
koteitag.querySelector('label').appendChild(koteiinput);
document.querySelector('div.compose-form__buttons-wrapper').after(koteitag);
}
function addKoteitagButton(){
var koteitag = document.createElement('div');
koteitag.classList.add('compose-form__tag-button');
koteitag.addEventListener('click', clicktagbutton);
var koteibutton = document.createElement('button');
koteibutton.classList.add('text-icon-button');
koteibutton.setAttribute('title', '固定タグが設定されていません');
koteibutton.setAttribute('aria-controls', 'koteitag-input');
koteitag.appendChild(koteibutton);
var koteiicon = document.createElement('i');
koteiicon.classList.add('fa', 'fa-fw', 'fa-hashtag');
koteiicon.setAttribute('aria-hidden', 'true');
koteitag.querySelector('button').appendChild(koteiicon);
document.querySelector('.compose-form__buttons').appendChild(koteitag);
}
function setEvents(){
document.querySelector('div.compose-form__publish-button-wrapper .button').addEventListener('click', setkoteitag);
document.querySelector('.autosuggest-textarea__textarea').addEventListener('keydown', pressed_keyconfirm);
}
function pressed_keyconfirm() {
if(event.ctrlKey){
if(event.keyCode === 13){
setkoteitag();
return false;
}
}
}
function selectTags(){
//var accountId = document.querySelector('div.navigation-bar .permalink').getAttribute('to').replace('/accounts/', '');
//console.log(localStorage.getItem('mastodon_tag_history.id' + accountId););
if(localStorage.getItem('karasu_koteitag_list') == null){
return;
}
if(template_list == null){
template_list = localStorage.getItem('karasu_koteitag_list').split(",");
}else{
if(event.keyCode === 33){
if(koteitag_list_index >= template_list.length - 1){
koteitag_list_index = 0;
}else{
koteitag_list_index++;
}
document.querySelector('.koteitag-input__input').value = template_list[koteitag_list_index];
}else if(event.keyCode === 34){
if(koteitag_list_index === 0 ){
koteitag_list_index = template_list.length - 1;
}else{
koteitag_list_index--;
}
document.querySelector('.koteitag-input__input').value = template_list[koteitag_list_index];
}
}
}
function setkoteitag() {
if(document.querySelector('.compose-form__tag-button .text-icon-button').getAttribute('title') == "固定タグが設定されています"){
var statusValue = String(document.querySelector('.autosuggest-textarea__textarea').value);
var koteitag = String(document.querySelector('.koteitag-input__input').value);
if(statusValue != "" && koteitag != ""){
document.querySelector('.autosuggest-textarea__textarea').value = statusValue + " " + koteitag;
savekoteitag();
}
}
}
function savekoteitag() {
localStorage.setItem('karasu_koteitag', String(document.querySelector('.koteitag-input__input').value));
}
function clicktagbutton(){
if (document.querySelector('.compose-form__tag-button .text-icon-button').getAttribute('title') == "固定タグが設定されていません") {
document.querySelector('.compose-form__tag-button .text-icon-button').setAttribute('title','固定タグが設定されています');
document.querySelector('.compose-form__tag-button .text-icon-button').classList.add('active');
document.querySelector('.koteitag-input__input').setAttribute('tabindex','1');
document.querySelector('.koteitag-input').classList.add('koteitag-input--visible');
document.querySelector('.koteitag-input__input').focus();
} else {
document.querySelector('.compose-form__tag-button .text-icon-button').setAttribute('title','固定タグが設定されていません');
document.querySelector('.compose-form__tag-button .text-icon-button').classList.remove('active');
document.querySelector('.koteitag-input__input').setAttribute('tabindex','-1');
document.querySelector('.koteitag-input').classList.remove('koteitag-input--visible');
}
}
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.