RushHour Bookmark

ページのクリックしたリスト要素(ul.list1)に枠(border)を追加しxpathを保存・復元時にスクロール

スクリプトをインストールするには、Tampermonkey, GreasemonkeyViolentmonkey のような拡張機能のインストールが必要です。

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

スクリプトをインストールするには、TampermonkeyViolentmonkey のような拡張機能のインストールが必要です。

スクリプトをインストールするには、TampermonkeyUserscripts のような拡張機能のインストールが必要です。

このスクリプトをインストールするには、Tampermonkeyなどの拡張機能をインストールする必要があります。

このスクリプトをインストールするには、ユーザースクリプト管理ツールの拡張機能をインストールする必要があります。

(ユーザースクリプト管理ツールは設定済みなのでインストール!)

このスタイルをインストールするには、Stylusなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus などの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus tなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

(ユーザースタイル管理ツールは設定済みなのでインストール!)

このスクリプトの質問や評価の投稿はこちら通報はこちらへお寄せください
// ==UserScript==
// @name         RushHour Bookmark
// @namespace    tampermonkey.net
// @version      2.1
// @description  ページのクリックしたリスト要素(ul.list1)に枠(border)を追加しxpathを保存・復元時にスクロール
// @author       Toshiaki
// @match        https://wikiwiki.jp/ali_may/%E3%83%A9%E3%83%83%E3%82%B7%E3%83%A5%E3%82%A2%E3%83%AF%E3%83%BC/%E5%9C%B0%E4%B8%8B%E9%A7%90%E8%BB%8A%E5%A0%B4
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_deleteValue
// @grant        GM_registerMenuCommand
// @run-at       document-idle
// @license      MIT
// ==/UserScript==

(function() {
	'use strict';

	const key = 'ali_may_'+location.pathname;
	GM_registerMenuCommand('delete Bookmark', () => {
		GM_deleteValue(key);
	});

	window.addEventListener('load', () => {
		const xpath = GM_getValue(key, '');
		if (xpath) {
			console.log(`xpath(${xpath})`);
			const result = document.evaluate(xpath, document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
			if (result.snapshotLength > 0) {
				const firstElement = result.snapshotItem(0);
				updateList(firstElement);
				firstElement.scrollIntoView({ behavior: 'smooth', block: 'center', inline: 'nearest'});
				//console.log(firstElement.textContent);
			} else {
				console.log(`xpath(${xpath}) element not found.`);
			}
		}
	});

	const getXPath = (element) => {
		if (element.id !== '') {
			return `id("${element.id}")`;
		}
		if (element === document.body) {
			return '/html/' + element.tagName.toLowerCase();
		}
		let ix = 0;
		let siblings = element.parentNode.childNodes;
		for (let i = 0; i < siblings.length; i++) {
			let sibling = siblings[i];
			if (sibling === element) {
				return getXPath(element.parentNode) + '/' + element.tagName.toLowerCase() + '[' + (ix + 1) + ']';
			}
			if (sibling.nodeType === 1 && sibling.tagName === element.tagName) {
				ix++;
			}
		}
	}
	let ul = null;
	const updateList = (element) => {
		if (element) {//remove border add border
			if (ul) {
				ul.style.outline = '';
				ul.style.outlineOffset = '';
			}
			ul = element;
			ul.style.outline = '4px solid #111111';
			ul.style.outlineOffset = '2px';
			GM_setValue(key, getXPath(ul));
		}
	}
	document.addEventListener('click', (e) => {
		updateList(e.target.closest('ul.list1'));
	}, true);

})();