☰

VRChat Web Pages Extender

Add features into VRChat Web Pages and improve user experience.

目前为 2022-06-05 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        VRChat Web Pages Extender
  3. // @name:ja     VRChat Webページ拡張
  4. // @description Add features into VRChat Web Pages and improve user experience.
  5. // @description:ja VRChatのWebページに機能を追加し、また使い勝手を改善します。
  6. // @namespace   https://greasyfork.org/users/137
  7. // @version     2.9.0
  8. // @match       https://www.vrchat.com/*
  9. // @match       https://vrchat.com/*
  10. // @match       https://api.vrchat.cloud/*
  11. // @require     https://greasyfork.org/scripts/19616/code/utilities.js?version=895049
  12. // @license     MPL-2.0
  13. // @contributionURL https://pokemori.booth.pm/items/969835
  14. // @compatible  Edge
  15. // @compatible  Firefox Firefoxを推奨 / Firefox is recommended
  16. // @compatible  Opera
  17. // @compatible  Chrome
  18. // @grant       dummy
  19. // @run-at      document-start
  20. // @icon        https://images.squarespace-cdn.com/content/v1/5f0770791aaf57311515b23d/1599678606410-4QMTB25DHF87E8EFFKXY/ke17ZwdGBToddI8pDm48kGfiFqkITS6axXxhYYUCnlRZw-zPPgdn4jUwVcJE1ZvWQUxwkmyExglNqGp0IvTJZUJFbgE-7XRK3dMEBRBhUpxQ1ibo-zdhORxWnJtmNCajDe36aQmu-4Z4SFOss0oowgxUaachD66r8Ra2gwuBSqM/favicon.ico
  21. // @author      100の人
  22. // @homepageURL https://greasyfork.org/ja/scripts/371331-vrchat-web-pages-extender
  23. // ==/UserScript==
  24.  
  25. 'use strict';
  26.  
  27. // L10N
  28. Gettext.setLocalizedTexts({
  29. 	/*eslint-disable quote-props, max-len */
  30. 	'en': {
  31. 		'エラーが発生しました': 'Error occurred',
  32. 		'$LENGTH$ 文字まで表示可能です。': 'This text is displayed up to $LENGTH$ characters.',
  33. 	},
  34. 	/*eslint-enable quote-props, max-len */
  35. });
  36.  
  37. Gettext.setLocale(navigator.language);
  38.  
  39.  
  40.  
  41. if (typeof content !== 'undefined') {
  42. 	// For Greasemonkey 4
  43. 	fetch = content.fetch.bind(content); //eslint-disable-line no-global-assign, no-native-reassign, no-undef
  44. }
  45.  
  46.  
  47.  
  48. /**
  49.  * ページ上部にエラー内容を表示します。
  50.  * @param {Error} exception
  51.  * @returns {void}
  52.  */
  53. function showError(exception)
  54. {
  55. 	console.error(exception);
  56. 	try {
  57. 		const errorMessage = _('エラーが発生しました') + ': ' + exception
  58. 			+ ('stack' in exception ? '\n\n' + exception.stack : '');
  59. 		const homeContent = document.getElementsByClassName('home-content')[0];
  60. 		if (homeContent) {
  61. 			homeContent.firstElementChild.firstElementChild.insertAdjacentHTML('afterbegin', h`<div class="row">
  62. 				<div class="alert alert-danger fade show" role="alert"
  63. 					style="white-space: pre-wrap; font-size: 1rem; font-weight: normal;">${errorMessage}</div>
  64. 			</div>`);
  65. 		} else {
  66. 			alert(errorMessage);
  67. 		}
  68. 	} catch (e) {
  69. 		alert(_('エラーが発生しました') + ': ' + e);
  70. 	}
  71. }
  72.  
  73. const ID = 'vrchat-web-pages-extender-137';
  74.  
  75. /**
  76.  * 一度に取得できる最大の要素数。
  77.  * @constant {number}
  78.  */
  79. const MAX_ITEMS_COUNT = 100;
  80.  
  81. /**
  82.  * Statusの種類。
  83.  * @constant {number}
  84.  */
  85. const STATUSES = {
  86. 	'join me': {
  87. 		label: 'Join Me: Auto-accept join requests.',
  88. 		color: '--status-joinme',
  89. 	},
  90. 	active: {
  91. 		label: 'Online: See join requests.',
  92. 		color: '--status-online',
  93. 	},
  94. 	'ask me': {
  95. 		label: 'Ask Me: Hide location, see join requests.',
  96. 		color: '--status-askme',
  97. 	},
  98. 	busy: {
  99. 		label: 'Do Not Disturb: Hide location, hide join requests.',
  100. 		color: '--status-busy',
  101. 	},
  102. };
  103.  
  104. /**
  105.  * Status Descriptionの最大文字数。
  106.  * @constant {number}
  107.  */
  108. const MAX_STATUS_DESCRIPTION_LENGTH = 32;
  109.  
  110. /**
  111.  * 一つのブックマークグループの最大登録数。
  112.  * @constant {number}
  113.  */
  114. const MAX_FAVORITES_COUNT_PER_GROUP = 64;
  115.  
  116. /**
  117.  * @type {Function}
  118.  * @access private
  119.  */
  120. let resolveUserDetails;
  121.  
  122. /**
  123.  * @type {Promise.<Object>}
  124.  * @access private
  125.  */
  126. const userDetails = new Promise(function (resolve) {
  127. 	resolveUserDetails = resolve;
  128. });
  129.  
  130. addEventListener('message', function receiveUserDetails(event) {
  131. 	if (event.origin !== location.origin || typeof event.data !== 'object' || event.data === null
  132. 		|| event.data.id !== ID || !event.data.userDetails) {
  133. 		return;
  134. 	}
  135. 	
  136. 	event.currentTarget.removeEventListener(event.type, receiveUserDetails);
  137.  
  138. 	resolveUserDetails(event.data.userDetails);
  139. });
  140.  
  141. /**
  142.  * ログインしているユーザーの情報を取得します。
  143.  * @see [User Info — VRChat API Documentation]{@link https://vrchatapi.github.io/#/UserAPI/CurrentUserDetails}
  144.  * @returns {Promise.<?Object.<(string|string[]|boolean|number|Object)>>}
  145.  */
  146. async function getUserDetails()
  147. {
  148. 	return await userDetails;
  149. }
  150.  
  151. /**
  152.  * JSONファイルをオブジェクトとして取得します。
  153.  * @param {string} url
  154.  * @returns {Promise.<(Object|Array)>} OKステータスでなければ失敗します。
  155.  */
  156. async function fetchJSON(url)
  157. {
  158. 	const response = await fetch(url, {credentials: 'same-origin'});
  159. 	return response.ok
  160. 		? response.json()
  161. 		: Promise.reject(new Error(`${response.status}  ${response.statusText}\n${await response.text()}`));
  162. }
  163.  
  164. /**
  165.  * スクリプトで扱うブックマークの種類。
  166.  * @constant {string[]}
  167.  */
  168. const FAVORITE_TYPES = ['friend', 'world'];
  169.  
  170. let favoriteTypeGroupsPairsPromise;
  171.  
  172. /**
  173.  * ログインしているユーザーのfavoriteのグループ名を取得します。
  174.  * @returns {Object.<Object.<string>[]>} {@link FAVORITE_TYPES}の要素をキーに持つ連想配列。
  175.  */
  176. function getFavoriteTypeGroupsPairs()
  177. {
  178. 	if (!favoriteTypeGroupsPairsPromise) {
  179. 		favoriteTypeGroupsPairsPromise = fetchJSON('/api/1/favorite/groups', {credentials: 'same-origin'})
  180. 			.then(function (groups) {
  181. 				const favoriteTypeGroupsPairs = {};
  182. 				for (const group of groups.filter(group => FAVORITE_TYPES.includes(group.type))) {
  183. 					if (!(group.type in favoriteTypeGroupsPairs)) {
  184. 						favoriteTypeGroupsPairs[group.type] = {};
  185. 					}
  186. 					favoriteTypeGroupsPairs[group.type][group.name] = group.displayName;
  187. 				}
  188. 				return favoriteTypeGroupsPairs;
  189. 			});
  190. 	}
  191. 	return favoriteTypeGroupsPairsPromise;
  192. }
  193.  
  194. /**
  195.  * @type {Promise.<Object.<(string|string[])[]>[]>}
  196.  * @access private
  197.  */
  198. let favorites;
  199.  
  200. /**
  201.  * ブックマークを全件取得します。
  202.  * @see [List Favorites — VRChat API Documentation]{@link https://vrchatapi.github.io/#/FavoritesAPI/ListAllFavorites}
  203.  * @returns {Promise.<Object.<(string|string[])[]>[]>} {@link FAVORITE_TYPES}の要素をキーに持つ連想配列。
  204.  */
  205. function getFavorites()
  206. {
  207. 	return favorites || (favorites = async function () {
  208. 		const allFavorites = { };
  209. 		for (const type of FAVORITE_TYPES) {
  210. 			allFavorites[type] = [];
  211. 		}
  212. 		let offset = 0;
  213. 		while (true) {
  214. 			const favorites
  215. 				= await fetchJSON(`/api/1/favorites/?n=${MAX_ITEMS_COUNT}&offset=${offset}`).catch(showError);
  216.  
  217. 			for (const favorite of favorites) {
  218. 				if (!FAVORITE_TYPES.includes(favorite.type)) {
  219. 					continue;
  220. 				}
  221. 				allFavorites[favorite.type].push(favorite);
  222. 			}
  223.  
  224. 			if (favorites.length < MAX_ITEMS_COUNT) {
  225. 				break;
  226. 			}
  227.  
  228. 			offset += favorites.length;
  229. 		}
  230. 		return allFavorites;
  231. 	}());
  232. }
  233.  
  234. /**
  235.  * 「Edit Profile」ページに、ステータス文変更フォームを挿入します。
  236.  * @returns {Promise.<void>}
  237.  */
  238. async function insertUpdateStatusForm()
  239. {
  240. 	if ('update-status' in document.forms) {
  241. 		return;
  242. 	}
  243.  
  244. 	const sidebarStatus = document.querySelector('.leftbar .user-info h6 span[title]');
  245. 	const sidebarStatusDescription = document.querySelector('.leftbar .statusDescription small');
  246.  
  247. 	const templateCard = document.getElementById('name-change-submit').closest('.card');
  248. 	const card = templateCard.cloneNode(true);
  249. 	card.getElementsByClassName('card-header')[0].textContent = 'Status';
  250. 	const form = card.getElementsByTagName('form')[0];
  251. 	form.name = 'update-status';
  252. 	form.action = '/api/1/users/' + document.querySelector('[href*="/home/user/usr_"]').pathname.replace(/.+\//u, '');
  253.  
  254. 	const description = form.displayName;
  255. 	description.id = 'status-description';
  256. 	description.type = 'text';
  257. 	description.name = 'statusDescription';
  258. 	description.value = sidebarStatusDescription.textContent;
  259. 	description.placeholder = '';
  260. 	description.pattern = `.{0,${MAX_STATUS_DESCRIPTION_LENGTH}}`;
  261. 	description.title = _('$LENGTH$ 文字まで表示可能です。').replace('$LENGTH$', MAX_STATUS_DESCRIPTION_LENGTH);
  262. 	description.parentElement.getElementsByClassName('alert')[0].remove();
  263. 	const descriptionContainer = description.closest('.col-10');
  264. 	descriptionContainer.classList.replace('col-10', 'col');
  265.  
  266. 	descriptionContainer.parentElement.classList.add('mb-2');
  267. 	
  268. 	const statusContainer = descriptionContainer.previousElementSibling;
  269. 	statusContainer.outerHTML = '<div class="col-auto"><select name="status" class="form-control">'
  270. 		+ Object.keys(STATUSES).map(status => h`<option value="${status}">⬤ ${STATUSES[status].label}</option>`)
  271. 			.join('')
  272. 	+ '</select></div>';
  273. 	form.status.value = sidebarStatus.title;
  274. 	form.status.classList.add(form.status.value.replace(' ', '-'));
  275. 	form.status.addEventListener('change', function (event) {
  276. 		const classList = event.target.classList;
  277. 		classList.remove(...Object.keys(STATUSES).map(status => status.replace(' ', '-')));
  278. 		classList.add(event.target.value.replace(' ', '-'));
  279. 	});
  280.  
  281. 	const submit = form.getElementsByClassName('btn')[0];
  282. 	submit.id = 'status-change-submit';
  283. 	submit.textContent = 'Update Status';
  284. 	submit.disabled = false;
  285. 	
  286. 	form.addEventListener('submit', function (event) {
  287. 		event.preventDefault();
  288. 		for (const control of event.target) {
  289. 			control.disabled = true;
  290. 		}
  291.  
  292. 		const body = {};
  293. 		for (const element of event.target) {
  294. 			if (element.localName === 'button') {
  295. 				continue;
  296. 			}
  297. 			body[element.name] = element.value;
  298. 		}
  299.  
  300. 		fetch(event.target.action, {
  301. 			method: 'PUT',
  302. 			headers: {'content-type': 'application/json'},
  303. 			credentials: 'same-origin',
  304. 			body: JSON.stringify(body),
  305. 		})
  306. 			.then(async function (response) {
  307. 				if (!response.ok) {
  308. 					return Promise.reject(
  309. 						new Error(`${response.status}  ${response.statusText}\n${await response.text()}`)
  310. 					);
  311. 				}
  312. 				sidebarStatus.classList.remove(...Object.keys(STATUSES).map(status => status.replace(' ', '-')));
  313. 				sidebarStatus.classList.add(event.target.status.value.replace(' ', '-'));
  314. 				sidebarStatus.title = event.target.status;
  315. 				sidebarStatusDescription.textContent = event.target.statusDescription.value;
  316. 			})
  317. 			.catch(showError)
  318. 			.then(function () {
  319. 				for (const control of event.target) {
  320. 					control.disabled = false;
  321. 				}
  322. 			});
  323. 	});
  324.  
  325. 	templateCard.parentElement.getElementsByClassName('card')[0].before(card, document.createElement('hr'));
  326. }
  327.  
  328. /**
  329.  * ブックマーク登録/解除ボタンの登録数表示を更新します。
  330.  * @param {string} type - 「user」「favorite」のいずれか。
  331.  * @returns {Promise.<void>}
  332.  */
  333. async function updateFavoriteCounts(type)
  334. {
  335. 	const counts = {};
  336. 	for (const favorite of (await getFavorites())[type]) {
  337. 		for (const tag of favorite.tags) {
  338. 			if (!(tag in counts)) {
  339. 				counts[tag] = 0;
  340. 			}
  341. 			counts[tag]++;
  342. 		}
  343. 	}
  344.  
  345. 	for (const button of document.getElementsByName('favorite-' + type)) {
  346. 		button.getElementsByClassName('count')[0].textContent = counts[button.value] || 0;
  347. 	}
  348. }
  349.  
  350. /**
  351.  * ブックマーク登録/解除ボタンを追加します。
  352.  * @param {string} type - {@link FAVOLITE_TYPES}のいずれかの要素。
  353.  * @returns {Promise.<void>}
  354.  */
  355. async function insertFavoriteButtons(type)
  356. {
  357. 	const homeContent = document.getElementsByClassName('home-content')[0];
  358. 	if (homeContent.querySelector('[aria-label="Private World Callout"]')) {
  359. 		// privateワールド
  360. 		return;
  361. 	}
  362.  
  363. 	const sibling = type === 'friend'
  364. 		? homeContent.querySelector('[role="group"]')
  365. 		: homeContent.getElementsByClassName('justify-content-between flex-column flex-sm-row')[1];
  366. 	if (!sibling) {
  367. 		return;
  368. 	}
  369. 	const parent = sibling.closest('[class*="col-"]');
  370.  
  371. 	const result = /[a-z]+_[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}/.exec(location.pathname);
  372. 	if (!result) {
  373. 		return;
  374. 	}
  375. 	const id = result[0];
  376.  
  377. 	const buttons = document.getElementsByName('favorite-' + type);
  378. 	if (type === 'friend' && !(await getUserDetails()).friends.includes(id) || buttons[0]) {
  379. 		return;
  380. 	}
  381.  
  382. 	const groupNameDisplayNamePairs = (await getFavoriteTypeGroupsPairs())[type];
  383. 	const groupNames = Object.keys(groupNameDisplayNamePairs);
  384. 	const button = parent.querySelector(`[name="favorite-${CSS.escape(type)}"][value="${CSS.escape(groupNames[0])}"]`);
  385. 	if (button) {
  386. 		// 多重挿入の防止
  387. 		if (type === 'world') {
  388. 			const buttonsParent = button.closest('[role="group"]');
  389. 			if (sibling.nextElementSibling !== buttonsParent) {
  390. 				sibling.after(buttonsParent);
  391. 			}
  392. 		}
  393. 		return;
  394. 	}
  395. 	sibling.insertAdjacentHTML('afterend', '<div role="group" class="w-100 btn-group-lg btn-group-vertical mt-4">'
  396. 		+ groupNames.sort().map(tag => h`<button type="button"
  397. 			class="btn btn-secondary" name="favorite-${type}" value="${tag}" disabled="">
  398. 			<span aria-hidden="true" class="fa fa-star"></span>
  399. 			&#xA0;<span class="name">${groupNameDisplayNamePairs[tag]}</span>
  400. 			&#xA0;<span class="count">‒</span>⁄${MAX_FAVORITES_COUNT_PER_GROUP}
  401. 		</button>`).join('')
  402. 	+ '</div>');
  403.  
  404. 	await updateFavoriteCounts(type);
  405.  
  406. 	const tags = [].concat(...(await getFavorites())[type]
  407. 		.filter(favorite => favorite.favoriteId === id)
  408. 		.map(favorite => favorite.tags));
  409.  
  410. 	for (const button of buttons) {
  411. 		button.dataset.id = id;
  412. 		if (tags.includes(button.value)) {
  413. 			button.classList.remove('btn-secondary');
  414. 			button.classList.add('btn-primary');
  415. 		}
  416. 		if (button.classList.contains('btn-primary')
  417. 			|| button.getElementsByClassName('count')[0].textContent < MAX_FAVORITES_COUNT_PER_GROUP) {
  418. 			button.disabled = false;
  419. 		}
  420. 	}
  421.  
  422. 	buttons[0].closest('[role="group"]').addEventListener('click', async function (event) {
  423. 		const button = event.target.closest('button');
  424. 		if (!button || button.name !== 'favorite-' + type) {
  425. 			return;
  426. 		}
  427.  
  428. 		const buttons = document.getElementsByName('favorite-' + type);
  429. 		for (const button of buttons) {
  430. 			button.disabled = true;
  431. 		}
  432.  
  433. 		const id = button.dataset.id;
  434. 		const newTags = button.classList.contains('btn-secondary') ? [button.value] : [];
  435.  
  436. 		const favorites = (await getFavorites())[type];
  437. 		for (let i = favorites.length - 1; i >= 0; i--) {
  438. 			if (favorites[i].favoriteId === id) {
  439. 				await fetch(
  440. 					'/api/1/favorites/' + favorites[i].id,
  441. 					{method: 'DELETE', credentials: 'same-origin'}
  442. 				);
  443.  
  444. 				for (const button of buttons) {
  445. 					if (favorites[i].tags.includes(button.value)) {
  446. 						button.classList.remove('btn-primary');
  447. 						button.classList.add('btn-secondary');
  448. 					}
  449. 				}
  450.  
  451. 				favorites.splice(i, 1);
  452. 			}
  453. 		}
  454.  
  455. 		if (newTags.length > 0) {
  456. 			await fetch('/api/1/favorites', {
  457. 				method: 'POST',
  458. 				headers: { 'content-type': 'application/json' },
  459. 				credentials: 'same-origin',
  460. 				body: JSON.stringify({type, favoriteId: id, tags: newTags}),
  461. 			})
  462. 				.then(async response => response.ok ? response.json() : Promise.reject(
  463. 					new Error(`${response.status}  ${response.statusText}\n${await response.text()}`)
  464. 				))
  465. 				.then(function (favorite) {
  466. 					favorites.push(favorite);
  467. 					for (const button of buttons) {
  468. 						if (favorite.tags.includes(button.value)) {
  469. 							button.classList.remove('btn-secondary');
  470. 							button.classList.add('btn-primary');
  471. 						}
  472. 					}
  473. 				})
  474. 				.catch(showError);
  475. 		}
  476.  
  477. 		await updateFavoriteCounts(type);
  478.  
  479. 		for (const button of buttons) {
  480. 			if (button.getElementsByClassName('count')[0].textContent < MAX_FAVORITES_COUNT_PER_GROUP) {
  481. 				button.disabled = false;
  482. 			}
  483. 		}
  484. 	});
  485. }
  486.  
  487. /**
  488.  * フレンド一覧で次のページが確実に存在しない場合、次ページのボタンを無効化します。
  489.  * また、オンラインのフレンド数を表示します。
  490.  * @param {HTMLDivElement} group 「friend-group」クラスを持つ要素。
  491.  * @returns {void}
  492.  */
  493. function improveFriendList(group)
  494. {
  495. 	// フレンド一覧で次のページが確実に存在しない場合、次ページのボタンを無効化します
  496. 	const pager = group.querySelector('.friend-group > div:last-of-type');
  497. 	const count = group.querySelectorAll('.friend-group > div:not(:last-of-type)').length;
  498. 	const nextPageButton = pager.getElementsByClassName('fa-angle-down')[0].closest('button');
  499. 	nextPageButton.disabled = count < MAX_ITEMS_COUNT;
  500.  
  501. 	// オンラインのフレンド数を表示します
  502. 	const heading = group.firstElementChild;
  503. 	if (heading.textContent.includes('Online')) {
  504. 		heading.textContent = `Online (${
  505. 			MAX_ITEMS_COUNT * (/[0-9]+/.exec(pager.getElementsByClassName('page')[0].textContent)[0] - 1)
  506. 				+ count
  507. 				+ (nextPageButton.disabled ? '' : '+')
  508. 		})`;
  509. 	}
  510. }
  511.  
  512. /**
  513.  * ページ読み込み後に一度だけ実行する処理をすでに行っていれば `true`。
  514.  * @type {boolean}
  515.  * @access private
  516.  */
  517. let headChildrenInserted = false;
  518.  
  519. new MutationObserver(async function (mutations) {
  520. 	if (document.head && !headChildrenInserted) {
  521. 		headChildrenInserted = true;
  522. 		document.head.insertAdjacentHTML('beforeend', `<style>
  523. 			/*====================================
  524. 				Edit Profile
  525. 			*/
  526. 			` + Object.keys(STATUSES).map(status => `
  527. 				[name="status"].${CSS.escape(status.replace(' ', '-'))},
  528. 				[name="status"] option[value=${CSS.escape(status)}] {
  529. 					color: var(${STATUSES[status].color});
  530. 				}
  531. 			`).join('') + `
  532.  
  533. 			/*====================================
  534. 				フレンドのユーザーページ
  535. 			*/
  536. 			.btn[name^="favorite-"] {
  537. 				white-space: unset;
  538. 			}
  539. 		</style>`);
  540.  
  541. 		// ユーザー情報を取得します
  542. 		GreasemonkeyUtils.executeOnUnsafeContext(function (id) {
  543.  
  544. 			const responseText = Object.getOwnPropertyDescriptor(XMLHttpRequest.prototype, 'responseText');
  545. 			responseText.get = new Proxy(responseText.get, {
  546. 				apply(get, thisArgument, argumentList)
  547. 				{
  548. 					const responseText = Reflect.apply(get, thisArgument, argumentList);
  549. 					if (thisArgument.status === 200
  550. 						&& new URL(thisArgument.responseURL).pathname === '/api/1/auth/user') {
  551. 						postMessage({ id, userDetails: JSON.parse(responseText) }, location.origin);
  552. 					}
  553. 					return responseText;
  554. 				},
  555. 			});
  556. 			Object.defineProperty(XMLHttpRequest.prototype, 'responseText', responseText);
  557. 		}, [ ID ]);
  558. 	}
  559.  
  560. 	for (const mutation of mutations) {
  561. 		let parent = mutation.target;
  562. 		if (parent.id === 'home') {
  563. 			break;
  564. 		}
  565.  
  566. 		if (/* URLを開いたとき */ parent.localName === 'head' && document.body
  567. 			|| /* ページを移動したとき */ parent.id === 'app' || parent.classList.contains('home-content')
  568. 				|| parent.parentElement && parent.parentElement.classList.contains('home-content')) {
  569. 			const homeContent = document.getElementsByClassName('home-content')[0];
  570. 			if (!homeContent || homeContent.getElementsByClassName('fa-cog')[0]) {
  571. 				break;
  572. 			}
  573.  
  574. 			if (location.pathname === '/home/profile') {
  575. 				// 「Edit Profile」ページなら
  576. 				//await insertUpdateStatusForm();
  577. 			} else if (location.pathname.startsWith('/home/user/')) {
  578. 				// ユーザーページ
  579. 				await insertFavoriteButtons('friend');
  580. 				const displayName = document.getElementsByTagName('h2')[0].textContent;
  581. 				const name = document.getElementsByTagName('h3')[0].firstElementChild.firstChild.data;
  582. 				document.title = `${displayName} — ${name} - VRChat`;
  583. 			} else if (location.pathname.startsWith('/home/world/')) {
  584. 				// ワールドページ
  585. 				await insertFavoriteButtons('world');
  586. 				const heading = document.querySelector('.home-content h2');
  587. 				const name = heading.firstChild.data;
  588. 				const author = heading.nextElementSibling.querySelector('[href^="/home/user/usr_"]').firstChild.data;
  589. 				document.title = `${name} By ${author} - VRChat`;
  590. 			}
  591. 		}
  592.  
  593. 		if (parent.classList.contains('friend-container')) {
  594. 			parent = mutation.addedNodes[0];
  595. 		}
  596.  
  597. 		if (parent.classList.contains('friend-group')) {
  598. 			let groups = document.getElementsByClassName('friend-group');
  599. 			const heading = groups[0].firstElementChild.textContent;
  600. 			if (groups.length === 1 || heading.includes('Online') && !heading.includes('(')) {
  601. 				groups = [parent];
  602. 			}
  603.  
  604. 			for (const group of groups) {
  605. 				improveFriendList(group);
  606. 			}
  607. 			break;
  608. 		}
  609. 	}
  610. }).observe(document, {childList: true, subtree: true});