フィルター（リンク）の登録機能
「TwAvoid」は「リンクコード」と「テキスト」でツイートを判定してフィルター操作をしますが、ツイッターのページ上で「リンクコード」を採取して簡単に登録できる様にしました。
採取した「リンクコード」はローカルストレージに保存するので、ブラウザやPCを閉じても、再びツイッターサイトを開いた時に、フィルターが変わらず機能します。
以下は、TVアニメ「デキる猫は今日も憂鬱」の公式ツイッター画面をサンプルにしています。 ブロック対象とした「DMM pictures」は、たまにこの公式のタイムラインに入って来る様で、関連グッズの販売元の様です。 この社のリンクを含むツイートをブロックする単なる例として、説明上で使わせてもらいました。
「リンクコード」の採取/登録
この公式のタイムラインに、時々入って来るツイート（タイムライン主のリポスト）で、下の「DMM pictures」のツイートを非表示にします。
下は、リポスト元の表示部で、赤枠はどちらもリンクになっています。
マウスでポイントすると、左側は下線が着いてフォローパネルが表示され、リンクだと確認できます。
右側は同じ「フォローパネル」が出ますが、下線は表示されません。 もちろん同じリンクコードで、ここでは左側でコードを採取します。
「リンクコード」の採取
● リンクの上で「Alt+右Click」します。
▪ この操作で画面の右上に「リストパネル」が表示されます。
▪ パネルを閉じるには ❸「✖」ボタンを「左Click」します。
❶「フィルター追加」ボタンに青枠が表示されている状態では、リンクコードの採取と登録ができます。（続けて登録することも可能です）
▪ ページ上のリンクを「Alt+右Click」する度に、❹「コード枠」にそのリンクコードが採り込まれます。
▪ 別のリンクを「Alt+右Click」すると、そのコードが採取され ❹ に表示されます。
「リンクコード」の登録
❶「フィルター追加」ボタンを「左Click」すると、❹ に表示されているリンクコードが ➎「フィルターリスト」に追加（登録）されます。
▪「フィルターリスト」に登録されたリンクを含むツイートが、非表示になります。
▪「リンク枠」のコードの編集や、枠内へのペーストが可能です。 編集したリンクコードを ❶ の「左Click」でリストに登録できます。
▪ ツイート上の実際のリンクコードと完全に一致しないコードは無効になります。
▪ 既に登録されているリンクコードの場合は、その故がアラート表示されます。
▪「半角/全角の空白文字」を含むコードは登録できません。 実際にはあり得ないコードでも登録できますが、ツールに無駄な動作をさせるだけです。
この様にして「フィルター追加」をした結果は、ツイッターのページをリロードするとタイムラインに反映します。（パネルを閉じずにリロードしてもOKです）
「リンクコード」の削除
リンクコードを削除するには、「リストパネル」を表示する必要があります。 そのために、何か適当なリンクを「Alt+右Click」してください。
❹ のコードはもちろん登録せずに ❷「フィルター削除」を「左Click」します。
▪ この操作で ❷ に青枠が移って、➎「フィルターリスト」の背景が白になり、リスト行の「左Click」が可能になります。
❷「フィルター削除」に青枠が表示された状態では、リストからリンクコードを削除する事ができます。（続けて削除することもできます）
▪ ➎「フィルターリスト」から削除したいリンクコードの行を「左Click」します。
ここでは、一番下の「temporary-link」を削除します。 これは、初期状態を判り易くするためのサンプルで、無効なコードです。
▪「temporary-link」の行を「左Click」すると、❹「コード枠」に同じリンクコードが表示されます。
これは、削除するリンクコードを指定した段階で、削除はされていません。 別の行を「左Click」して対象を変更でき、また「フィルター追加」や「✖」を「左Click」して削除を中止できます。
▪ ❷「フィルター削除」を「左Click」すると、❹「コード枠」に表示されたリンクコードが ➎「フィルターリスト」から削除されます。 これで登録削除が完了です。
▪「フィルター削除」をした結果は、ツイッターのページをリロードするとタイムラインに反映します。（パネルを閉じないままでリロードしてもOKです）
ご注意
今回導入した「リンクコード」の採取機能で、簡単にリンクコードの登録が出来る様になりましたが、「タイムライン」の「メインユーザー」のリンクコードを登録する事は、出来るだけ避ける様に注意してください。
このページのサンプルに使っている様な大変にツイート数が多いタイムラインで、「タイムライン」の「メインユーザー」の「リンクコード」をフィルター登録すると、タイムラインの殆どのツイートにが非表示対象になり、そのタイムラインを延々とスクロールさせて、最後には下の様なシステムのエラー処理が起こります。
これはどうやら、ツイッターのシステム側の過剰通信を防ぐための処置らしく、数分間に渡って、このページからのリクエストに反応しなくなります。 横の「返信」などの画面は反応しますが、「ポスト」のタイムラインは、上の画面のままで、リロードしても同じです。
この対策は考慮中ですが、普通に考えて「タイムラインの所有者」を非表示にするのは変な事ですから、この点は現在の「TwAvoid」の使用上の制限と考えてください。
「TwAvoid」を利用するには
このツールは Chrome / Edge / Firefox版の拡張機能「Tampermonkey」上で動作します。 以下に、このツールの導入手順を簡単に説明します。
❶「Tampermonkey」を導入します
◎ 使用しているブラウザに拡張機能「Tampermonkey」を導入する事が必要です。
既に「Tampermonkey」を導入している場合は、この手順 ❶ は不要です。
拡張機能の導入については、以下のページに簡単な説明があるので参照ください。
❷「Tampermonkey」にスクリプトを登録します
◎「Tampermonkey」の「＋」マークの「新規スクリプト」タブを開きます。
◎「新規スクリプト」には、最初からテンプレートが記入されています。 これは全て削除して、完全に空白の編集枠に 下のコードをコピー&ペーストします。
〔コピー方法〕 右サイドバーの マークのボタンを1度押してください。
コード枠内の右クリック ➔ コード全体の選択 ➔ コピー操作 が可能になります。
◎ 最後に「ファイル」メニューの「保存」を押すと、ツールが使用可能になります。
〔 TwAvoid 〕 ver. 0.3
// ==UserScript==
// @name TwAvoid
// @namespace http://tampermonkey.net/
// @version 0.3
// @description Twitter Filter
// @author Everyone
// @match https://twitter.com/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=twitter.com
// @grant none
// ==/UserScript==
// 🔴 特定の文字列を含むツイートを非表示 複数は縦棒で分割
let avoid_regexp=/@RakutenJP|楽天カード|プロモーション/;
let mode; // フィルターの追加「1」削除「0」
let avoid=[]; // フィルターの配列
let read_json=localStorage.getItem('TwAvoid_Link'); // ローカルストレージ保存名
avoid=JSON.parse(read_json);
if(avoid==null){
avoid=['temporary-link']; }
setTimeout(()=>{
let target=document.querySelector('head title');
let monitor0=new MutationObserver(page_ck);
monitor0.observe(target, { childList: true });
}, 200);
function page_ck(){
let retry=0;
let interval=setInterval(wait_target, 100);
function wait_target(){
retry++;
if(retry>50){ // リトライ制限 5secまで
clearInterval(interval); }
let time_line=get_line(); // 監視 target
if(time_line){
clearInterval(interval);
main();
let monitor1=new MutationObserver(main);
monitor1.observe(time_line, { childList: true }); }}
function get_line(){
let cell=document.querySelector('[data-testid="cellInnerDiv"]');
if(cell){
let container=cell.parentNode;
return container; }}
} // page_ck()
function main(){
let cell=document.querySelectorAll('[data-testid="cellInnerDiv"]');
for(let k=0; k<cell.length; k++){
if(cell[k].style.opacity!='2'){
// ❶ の検索処理 🟦⬜
let all_link=cell[k].querySelectorAll('a');
let url=[];
for(let i=0; i<all_link.length; i++){
url.push(all_link[i].getAttribute('href')); }
if(check_url(url)){
cell[k].style.display='none'; }
// ❷ の検索処理 🟦⬜
let tweet_text=cell[k].textContent;
if(avoid_regexp.test(tweet_text)){
cell[k].style.display='none'; }
cell[k].style.opacity='2' }}
function check_url(url){
let result=url.filter(data=>avoid.includes(data));
if(result.length>0){
return true; }}
} // main()
document.addEventListener('contextmenu', function(event){
if(event.altKey){
let elem=document.elementFromPoint(event.clientX, event.clientY);
if(elem){
let link_a=elem.closest('a');
if(link_a){
event.preventDefault();
event.stopImmediatePropagation();
let link_url=link_a.getAttribute('href');
disp_panel();
mode=1;
set_link(link_url);
}}}});
function disp_panel(){
let panel=
'<div id="twa_panel">'+
'<div class="swich_box">'+
'<div class="swich">'+
'<input class="add_b" type="button" value="フィルター追加">'+
'<input class="rem_b" type="button" value="フィルター削除">'+
'</div>'+
'<input class="twa_close" type="button" value="✖">'+
'</div>'+
'<div>'+
'<input class="set_box" type="text">'+
'</div>'+
'<div class="avoid_list">'+
'<ul class="avoid_ul"></ul>'+
'</div>'+
'<style>#twa_panel { position: fixed; top: 60px; right: 40px; width: 340px; '+
'font: 16px Meiryo; color: #000; background: #f4fbff; padding: 15px; '+
'border: 1px solid #aaa; box-shadow: 10px 20px 30px 0 #ccc;} '+
'.swich_box { display: flex; height: 30px; align-items: center; '+
'justify-content: space-between; } '+
'.swich_box input { padding: 3px 7px 2px; border: 1px solid #aaa; border-radius: 4px; height: 27px; } '+
'.swich { display: flex; justify-content: space-between; width: 260px; } '+
'.set_box { font: 16px Meiryo; padding: 4px 10px 3px; margin: 10px 0; '+
'width: calc(100% - 23px); } '+
'.set_box::placeholder { font-size: 14px; } '+
'.avoid_list { margin: 10px 0 0; padding: 4px 0; max-height: 240px; '+
'border: 1px solid #aaa; overflow-y: scroll; } '+
'.avoid_ul { list-style: none; padding: 0; margin: 0; } '+
'.avoid_ul.rem { background: #fff; } '+
'.avoid_ul.rem .avoid_li { cursor: pointer; } '+
'.avoid_li { padding: 3px 10px 0; height: 26px; border-bottom: 1px solid #ddd; '+
'white-space: nowrap; overflow-x: scroll; scrollbar-width: none; } '+
'.avoid_li:first-child { border-top: 1px solid #ddd; } '+
'.avoid_li::-webkit-scrollbar { display: none; } '+
'</style></div>';
if(!document.querySelector('#twa_panel')){
document.body.insertAdjacentHTML('beforeend', panel); }
} // disp_panel()
function set_link(url){
let set_box=document.querySelector('.set_box');
if(set_box){
set_box.value=url; }
set_new_link();
if(mode==1){
add_link(); }
else{
rem_link(); }
let twa_panel=document.querySelector('#twa_panel');
let twa_close=document.querySelector('.twa_close');
if(twa_panel && twa_close){
twa_close.onclick=()=>{
twa_panel.remove(); }}
} // set_link()
function add_link(){
let add_b=document.querySelector('.add_b');
add_b.style.outline='2px solid #2196f3';
let rem_b=document.querySelector('.rem_b');
rem_b.style.outline='';
let set_box=document.querySelector('.set_box');
set_box.setAttribute('placeholder', 'ページ上のリンクを「Alt+右Click」して採取');
let avoid_ul=document.querySelector('.avoid_ul');
avoid_ul.classList.remove('rem');
add_b.onclick=()=>{
let link_url=set_box.value;
if(link_url!=''){
if(space_check(link_url)){
alert("⛔ リンク表記に空白文字が含まれています"); }
else if(avoid.includes(link_url)){
alert("⛔ 既に登録済のリンクです"); }
else{
set_box.value='';
avoid.push(link_url);
set_new_link(); }}
function space_check(str){
let check=/\s+/g;
if(check.test(str)){
return true; }}}
rem_b.onclick=()=>{
mode=0;
set_link(''); }
} // add_link()
function rem_link(){
let add_b=document.querySelector('.add_b');
add_b.style.outline='';
let rem_b=document.querySelector('.rem_b');
rem_b.style.outline='2px solid #2196f3';
let set_box=document.querySelector('.set_box');
set_box.setAttribute('placeholder', '下のフィルターリストを「左Click」して指定');
let avoid_ul=document.querySelector('.avoid_ul');
avoid_ul.classList.add('rem');
let avoid_li=document.querySelectorAll('.avoid_li');
for(let k=0; k<avoid_li.length; k++){
avoid_li[k].onclick=()=>{
set_box.value=avoid_li[k].textContent; }}
rem_b.onclick=()=>{
if(set_box.value!=''){
if(!avoid.includes(set_box.value)){
alert("⛔ フィルターリストに該当するリンクがありません"); }
else{
avoid=avoid.filter(function(item){
return item!=set_box.value; });
set_box.value=''
set_new_link();
rem_link(); }}}
add_b.onclick=()=>{
mode=1;
set_link(''); }
} // rem_link()
function set_new_link(){
let set=new Set(avoid);
avoid=[...set]; // 追加分をチェックして配列を更新
let write_json=JSON.stringify(avoid);
localStorage.setItem('TwAvoid_Link', write_json); // ストレージ保存
let avoid_ul=document.querySelector('.avoid_ul');
if(avoid_ul){
avoid_ul.innerHTML=''; // リスト表示をクリア
for(let k=avoid.length-1; k>=0; k--){
let link_li='<li class="avoid_li">'+ avoid[k] +'</li>';
avoid_ul.insertAdjacentHTML('beforeend', link_li); }}
} // set_new_link()
「TwAvoid」最新版について
旧いバージョンの JavaScriptツールは、アメーバのページ構成の変更で動作しない場合があり、導入する場合は最新バージョンをお勧めします。
● 最新バージョンへのリンクは、以下のページのリンクリストから探せます。
